@react-three/postprocessing 2.5.1 → 2.5.4

package/dist/effects/Bloom.d.ts

@@ -1,6 +1,9 @@
 /// <reference types="react" />
 import { BloomEffect, BlendFunction } from 'postprocessing';
 export declare const Bloom: import("react").ForwardRefExoticComponent<{
+    mipmapBlur?: boolean;
+    radius?: number;
+    levels?: number;
     blendFunction?: BlendFunction;
     luminanceThreshold?: number;
     luminanceSmoothing?: number;

package/dist/index.cjs

@@ -10,7 +10,6 @@ var fiber = require('@react-three/fiber');
 var _extends = require('@babel/runtime/helpers/extends');
 var _construct = require('@babel/runtime/helpers/construct');
 var threeStdlib = require('three-stdlib');
-var mergeRefs = require('react-merge-refs');
 var screenSpaceReflections = require('screen-space-reflections');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -19,9 +18,8 @@ var _objectWithoutPropertiesLoose__default = /*#__PURE__*/_interopDefaultLegacy(
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
 var _construct__default = /*#__PURE__*/_interopDefaultLegacy(_construct);
-var mergeRefs__default = /*#__PURE__*/_interopDefaultLegacy(mergeRefs);
 
-var _excluded$8 = ["blendFunction", "opacity"];
+var _excluded$9 = ["blendFunction", "opacity"];
 
 var isRef = function isRef(ref) {
   return !!ref.current;
@@ -38,7 +36,7 @@ var wrapEffect = function wrapEffect(effectImpl, defaultBlendMode) {
   return /*#__PURE__*/React.forwardRef(function Wrap(_ref, ref) {
     var blendFunction = _ref.blendFunction,
         opacity = _ref.opacity,
-        props = _objectWithoutPropertiesLoose__default["default"](_ref, _excluded$8);
+        props = _objectWithoutPropertiesLoose__default["default"](_ref, _excluded$9);
 
     var invalidate = fiber.useThree(function (state) {
       return state.invalidate;
@@ -225,11 +223,11 @@ var EffectComposer = /*#__PURE__*/React__default["default"].memo( /*#__PURE__*/R
   }, children));
 }));
 
-var _excluded$7 = ["target", "depthTexture"];
+var _excluded$8 = ["target", "depthTexture"];
 var DepthOfField = /*#__PURE__*/React.forwardRef(function DepthOfField(_ref, ref) {
   var target = _ref.target,
       depthTexture = _ref.depthTexture,
-      props = _objectWithoutPropertiesLoose__default["default"](_ref, _excluded$7);
+      props = _objectWithoutPropertiesLoose__default["default"](_ref, _excluded$8);
 
   var invalidate = fiber.useThree(function (state) {
     return state.invalidate;
@@ -259,11 +257,11 @@ var DepthOfField = /*#__PURE__*/React.forwardRef(function DepthOfField(_ref, ref
 
 var DotScreen = wrapEffect(postprocessing.DotScreenEffect);
 
-var _excluded$6 = ["active"];
+var _excluded$7 = ["active"];
 var Glitch = /*#__PURE__*/React.forwardRef(function Glitch(_ref, ref) {
   var _ref$active = _ref.active,
       active = _ref$active === void 0 ? true : _ref$active,
-      props = _objectWithoutPropertiesLoose__default["default"](_ref, _excluded$6);
+      props = _objectWithoutPropertiesLoose__default["default"](_ref, _excluded$7);
 
   var invalidate = fiber.useThree(function (state) {
     return state.invalidate;
@@ -303,10 +301,10 @@ var GodRays = /*#__PURE__*/React.forwardRef(function GodRays(props, ref) {
   });
 });
 
-var _excluded$5 = ["size"];
+var _excluded$6 = ["size"];
 var Grid = /*#__PURE__*/React.forwardRef(function Grid(_ref, ref) {
   var size = _ref.size,
-      props = _objectWithoutPropertiesLoose__default["default"](_ref, _excluded$5);
+      props = _objectWithoutPropertiesLoose__default["default"](_ref, _excluded$6);
 
   var invalidate = fiber.useThree(function (state) {
     return state.invalidate;
@@ -329,7 +327,7 @@ var HueSaturation = wrapEffect(postprocessing.HueSaturationEffect);
 
 var Noise = wrapEffect(postprocessing.NoiseEffect, postprocessing.BlendFunction.COLOR_DODGE);
 
-var _excluded$4 = ["enabled", "children"];
+var _excluded$5 = ["enabled", "children"];
 var selectionContext = /*#__PURE__*/React.createContext(null);
 function Selection(_ref) {
   var children = _ref.children,
@@ -355,7 +353,7 @@ function Select(_ref2) {
   var _ref2$enabled = _ref2.enabled,
       enabled = _ref2$enabled === void 0 ? false : _ref2$enabled,
       children = _ref2.children,
-      props = _objectWithoutPropertiesLoose__default["default"](_ref2, _excluded$4);
+      props = _objectWithoutPropertiesLoose__default["default"](_ref2, _excluded$5);
 
   var group = React.useRef(null);
   var api = React.useContext(selectionContext);
@@ -387,7 +385,7 @@ function Select(_ref2) {
   }, props), children);
 }
 
-var _excluded$3 = ["selection", "selectionLayer", "blendFunction", "patternTexture", "edgeStrength", "pulseSpeed", "visibleEdgeColor", "hiddenEdgeColor", "width", "height", "kernelSize", "blur", "xRay"];
+var _excluded$4 = ["selection", "selectionLayer", "blendFunction", "patternTexture", "edgeStrength", "pulseSpeed", "visibleEdgeColor", "hiddenEdgeColor", "width", "height", "kernelSize", "blur", "xRay"];
 var Outline = /*#__PURE__*/React.forwardRef(function Outline(_ref, forwardRef) {
   var _ref$selection = _ref.selection,
       selection = _ref$selection === void 0 ? [] : _ref$selection,
@@ -403,8 +401,8 @@ var Outline = /*#__PURE__*/React.forwardRef(function Outline(_ref, forwardRef) {
       height = _ref.height,
       kernelSize = _ref.kernelSize,
       blur = _ref.blur,
-      xRay = _ref.xRay;
-      _objectWithoutPropertiesLoose__default["default"](_ref, _excluded$3);
+      xRay = _ref.xRay,
+      props = _objectWithoutPropertiesLoose__default["default"](_ref, _excluded$4);
 
   var invalidate = fiber.useThree(function (state) {
     return state.invalidate;
@@ -415,7 +413,7 @@ var Outline = /*#__PURE__*/React.forwardRef(function Outline(_ref, forwardRef) {
       camera = _useContext.camera;
 
   var effect = React.useMemo(function () {
-    return new postprocessing.OutlineEffect(scene, camera, {
+    return new postprocessing.OutlineEffect(scene, camera, _extends__default["default"]({
       blendFunction: blendFunction,
       patternTexture: patternTexture,
       edgeStrength: edgeStrength,
@@ -427,7 +425,7 @@ var Outline = /*#__PURE__*/React.forwardRef(function Outline(_ref, forwardRef) {
       kernelSize: kernelSize,
       blur: blur,
       xRay: xRay
-    });
+    }, props));
   }, [blendFunction, blur, camera, edgeStrength, height, hiddenEdgeColor, kernelSize, patternTexture, pulseSpeed, scene, visibleEdgeColor, width, xRay]);
   var api = React.useContext(selectionContext);
   React.useEffect(function () {
@@ -446,27 +444,23 @@ var Outline = /*#__PURE__*/React.forwardRef(function Outline(_ref, forwardRef) {
     effect.selectionLayer = selectionLayer;
     invalidate();
   }, [effect, selectionLayer]);
-  var ref = React.useRef();
+  React.useRef();
   React.useEffect(function () {
     if (api && api.enabled) {
       var _api$selected;
 
-      var _effect = ref.current;
-
       if ((_api$selected = api.selected) != null && _api$selected.length) {
-        _effect.selection.set(api.selected);
-
+        effect.selection.set(api.selected);
         invalidate();
         return function () {
-          _effect.selection.clear();
-
+          effect.selection.clear();
           invalidate();
         };
       }
     }
   }, [api]);
   return /*#__PURE__*/React__default["default"].createElement("primitive", {
-    ref: mergeRefs__default["default"]([ref, forwardRef]),
+    ref: forwardRef,
     object: effect
   });
 });
@@ -488,6 +482,8 @@ var Pixelation = /*#__PURE__*/React.forwardRef(function Pixelation(_ref, ref) {
 
 var Scanline = wrapEffect(postprocessing.ScanlineEffect, postprocessing.BlendFunction.OVERLAY);
 
+var _excluded$3 = ["selection", "selectionLayer", "lights", "luminanceThreshold", "luminanceSmoothing", "intensity", "width", "height", "kernelSize", "mipmapBlur", "radius", "levels"];
+
 var addLight = function addLight(light, effect) {
   return light.layers.enable(effect.selection.layer);
 };
@@ -508,7 +504,11 @@ var SelectiveBloom = /*#__PURE__*/React.forwardRef(function SelectiveBloom(_ref,
       intensity = _ref.intensity,
       width = _ref.width,
       height = _ref.height,
-      kernelSize = _ref.kernelSize;
+      kernelSize = _ref.kernelSize,
+      mipmapBlur = _ref.mipmapBlur,
+      radius = _ref.radius,
+      levels = _ref.levels,
+      props = _objectWithoutPropertiesLoose__default["default"](_ref, _excluded$3);
 
   if (lights.length === 0) {
     console.warn('SelectiveBloom requires lights to work.');
@@ -523,16 +523,19 @@ var SelectiveBloom = /*#__PURE__*/React.forwardRef(function SelectiveBloom(_ref,
       camera = _useContext.camera;
 
   var effect = React.useMemo(function () {
-    return new postprocessing.SelectiveBloomEffect(scene, camera, {
+    return new postprocessing.SelectiveBloomEffect(scene, camera, _extends__default["default"]({
       blendFunction: postprocessing.BlendFunction.SCREEN,
       luminanceThreshold: luminanceThreshold,
       luminanceSmoothing: luminanceSmoothing,
       intensity: intensity,
       width: width,
       height: height,
-      kernelSize: kernelSize
-    });
-  }, [camera, height, intensity, kernelSize, luminanceSmoothing, luminanceThreshold, scene, width]);
+      kernelSize: kernelSize,
+      mipmapBlur: mipmapBlur,
+      radius: radius,
+      levels: levels
+    }, props));
+  }, [camera, height, intensity, kernelSize, luminanceSmoothing, luminanceThreshold, scene, width, height, mipmapBlur, radius, levels]);
   var api = React.useContext(selectionContext);
   React.useEffect(function () {
     // Do not allow array selection if declarative selection is active
@@ -564,27 +567,23 @@ var SelectiveBloom = /*#__PURE__*/React.forwardRef(function SelectiveBloom(_ref,
       };
     }
   }, [effect, lights, selectionLayer]);
-  var ref = React.useRef();
+  React.useRef();
   React.useEffect(function () {
     if (api && api.enabled) {
       var _api$selected;
 
-      var _effect = ref.current;
-
       if ((_api$selected = api.selected) != null && _api$selected.length) {
-        _effect.selection.set(api.selected);
-
+        effect.selection.set(api.selected);
         invalidate();
         return function () {
-          _effect.selection.clear();
-
+          effect.selection.clear();
           invalidate();
         };
       }
     }
   }, [api]);
   return /*#__PURE__*/React__default["default"].createElement("primitive", {
-    ref: mergeRefs__default["default"]([ref, forwardRef]),
+    ref: forwardRef,
     object: effect,
     dispose: null
   });
@@ -729,6 +728,21 @@ var SSR = /*#__PURE__*/React.forwardRef(function SSR(_ref, ref) {
     });
     invalidate();
   }, [props]);
+  var api = React.useContext(selectionContext);
+  React.useEffect(function () {
+    if (api && api.enabled) {
+      var _api$selected;
+
+      if ((_api$selected = api.selected) != null && _api$selected.length) {
+        effect.selection.set(api.selected);
+        invalidate();
+        return function () {
+          effect.selection.clear();
+          invalidate();
+        };
+      }
+    }
+  }, [api]);
   return /*#__PURE__*/React__default["default"].createElement("primitive", {
     ref: ref,
     object: effect

package/dist/index.js

@@ -3,7 +3,6 @@ import React, { forwardRef, useMemo, useLayoutEffect, createContext, useEffect,
 import { Vector2, HalfFloatType, Vector3, TextureLoader, sRGBEncoding, RepeatWrapping } from 'three';
 import { useThree, useFrame, useLoader } from '@react-three/fiber';
 import { isWebGL2Available } from 'three-stdlib';
-import mergeRefs from 'react-merge-refs';
 import _extends from '@babel/runtime/helpers/esm/extends';
 import { SSREffect } from 'screen-space-reflections';
 
@@ -347,7 +346,8 @@ const Outline = /*#__PURE__*/forwardRef(function Outline(_ref, forwardRef) {
     height,
     kernelSize,
     blur,
-    xRay
+    xRay,
+    ...props
   }), [blendFunction, blur, camera, edgeStrength, height, hiddenEdgeColor, kernelSize, patternTexture, pulseSpeed, scene, visibleEdgeColor, width, xRay]);
   const api = useContext(selectionContext);
   useEffect(() => {
@@ -366,13 +366,11 @@ const Outline = /*#__PURE__*/forwardRef(function Outline(_ref, forwardRef) {
     effect.selectionLayer = selectionLayer;
     invalidate();
   }, [effect, selectionLayer]);
-  const ref = useRef();
+  useRef();
   useEffect(() => {
     if (api && api.enabled) {
       var _api$selected;
 
-      const effect = ref.current;
-
       if ((_api$selected = api.selected) != null && _api$selected.length) {
         effect.selection.set(api.selected);
         invalidate();
@@ -384,7 +382,7 @@ const Outline = /*#__PURE__*/forwardRef(function Outline(_ref, forwardRef) {
     }
   }, [api]);
   return /*#__PURE__*/React.createElement("primitive", {
-    ref: mergeRefs([ref, forwardRef]),
+    ref: forwardRef,
     object: effect
   });
 });
@@ -419,7 +417,11 @@ const SelectiveBloom = /*#__PURE__*/forwardRef(function SelectiveBloom(_ref, for
     intensity,
     width,
     height,
-    kernelSize
+    kernelSize,
+    mipmapBlur,
+    radius,
+    levels,
+    ...props
   } = _ref;
 
   if (lights.length === 0) {
@@ -438,8 +440,12 @@ const SelectiveBloom = /*#__PURE__*/forwardRef(function SelectiveBloom(_ref, for
     intensity,
     width,
     height,
-    kernelSize
-  }), [camera, height, intensity, kernelSize, luminanceSmoothing, luminanceThreshold, scene, width]);
+    kernelSize,
+    mipmapBlur,
+    radius,
+    levels,
+    ...props
+  }), [camera, height, intensity, kernelSize, luminanceSmoothing, luminanceThreshold, scene, width, height, mipmapBlur, radius, levels]);
   const api = useContext(selectionContext);
   useEffect(() => {
     // Do not allow array selection if declarative selection is active
@@ -467,13 +473,11 @@ const SelectiveBloom = /*#__PURE__*/forwardRef(function SelectiveBloom(_ref, for
       };
     }
   }, [effect, lights, selectionLayer]);
-  const ref = useRef();
+  useRef();
   useEffect(() => {
     if (api && api.enabled) {
       var _api$selected;
 
-      const effect = ref.current;
-
       if ((_api$selected = api.selected) != null && _api$selected.length) {
         effect.selection.set(api.selected);
         invalidate();
@@ -485,7 +489,7 @@ const SelectiveBloom = /*#__PURE__*/forwardRef(function SelectiveBloom(_ref, for
     }
   }, [api]);
   return /*#__PURE__*/React.createElement("primitive", {
-    ref: mergeRefs([ref, forwardRef]),
+    ref: forwardRef,
     object: effect,
     dispose: null
   });
@@ -617,6 +621,21 @@ const SSR = /*#__PURE__*/forwardRef(function SSR(_ref, ref) {
     Object.keys(props).forEach(key => effect[key] = props[key]);
     invalidate();
   }, [props]);
+  const api = useContext(selectionContext);
+  useEffect(() => {
+    if (api && api.enabled) {
+      var _api$selected;
+
+      if ((_api$selected = api.selected) != null && _api$selected.length) {
+        effect.selection.set(api.selected);
+        invalidate();
+        return () => {
+          effect.selection.clear();
+          invalidate();
+        };
+      }
+    }
+  }, [api]);
   return /*#__PURE__*/React.createElement("primitive", {
     ref: ref,
     object: effect

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-three/postprocessing",
-  "version": "2.5.1",
+  "version": "2.5.4",
   "description": "postprocessing wrapper for React and @react-three/fiber",
   "keywords": [
     "postprocessing",