@react-three/postprocessing 2.15.0 → 2.15.2

package/dist/effects/Autofocus.cjs

@@ -0,0 +1,126 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const THREE = require("three");
+const React = require("react");
+const fiber = require("@react-three/fiber");
+const postprocessing = require("postprocessing");
+const maath = require("maath");
+const DepthOfField = require("./DepthOfField.cjs");
+const EffectComposer = require("../EffectComposer.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const THREE__namespace = /* @__PURE__ */ _interopNamespaceDefault(THREE);
+const Autofocus = React.forwardRef(
+  ({ target = void 0, mouse: followMouse = false, debug = void 0, manual = false, smoothTime = 0.25, ...props }, fref) => {
+    const dofRef = React.useRef(null);
+    const hitpointRef = React.useRef(null);
+    const targetRef = React.useRef(null);
+    const scene = fiber.useThree(({ scene: scene2 }) => scene2);
+    const pointer = fiber.useThree(({ pointer: pointer2 }) => pointer2);
+    const { composer, camera } = React.useContext(EffectComposer.EffectComposerContext);
+    const [depthPickingPass] = React.useState(() => new postprocessing.DepthPickingPass());
+    const [copyPass] = React.useState(() => new postprocessing.CopyPass());
+    React.useEffect(() => {
+      composer.addPass(depthPickingPass);
+      composer.addPass(copyPass);
+      return () => {
+        composer.removePass(depthPickingPass);
+        composer.removePass(copyPass);
+      };
+    }, [composer, depthPickingPass, copyPass]);
+    React.useEffect(() => {
+      return () => {
+        depthPickingPass.dispose();
+        copyPass.dispose();
+      };
+    }, [depthPickingPass, copyPass]);
+    const [hitpoint] = React.useState(() => new THREE__namespace.Vector3(0, 0, 0));
+    const [ndc] = React.useState(() => new THREE__namespace.Vector3(0, 0, 0));
+    const getHit = React.useCallback(
+      async (x, y) => {
+        ndc.x = x;
+        ndc.y = y;
+        ndc.z = await depthPickingPass.readDepth(ndc);
+        ndc.z = ndc.z * 2 - 1;
+        const hit = 1 - ndc.z > 1e-7;
+        return hit ? ndc.unproject(camera) : false;
+      },
+      [ndc, depthPickingPass, camera]
+    );
+    const update = React.useCallback(
+      async (delta, updateTarget = true) => {
+        var _a;
+        if (target) {
+          hitpoint.set(...target);
+        } else {
+          const { x, y } = followMouse ? pointer : { x: 0, y: 0 };
+          const hit = await getHit(x, y);
+          if (hit)
+            hitpoint.copy(hit);
+        }
+        if (updateTarget && ((_a = dofRef.current) == null ? void 0 : _a.target)) {
+          if (smoothTime > 0 && delta > 0) {
+            maath.easing.damp3(dofRef.current.target, hitpoint, smoothTime, delta);
+          } else {
+            dofRef.current.target.copy(hitpoint);
+          }
+        }
+      },
+      [target, hitpoint, followMouse, getHit, smoothTime, pointer]
+    );
+    fiber.useFrame(async (_, delta) => {
+      var _a;
+      if (!manual) {
+        update(delta);
+      }
+      if (hitpointRef.current) {
+        hitpointRef.current.position.copy(hitpoint);
+      }
+      if (targetRef.current && ((_a = dofRef.current) == null ? void 0 : _a.target)) {
+        targetRef.current.position.copy(dofRef.current.target);
+      }
+    });
+    const api = React.useMemo(
+      () => ({
+        dofRef,
+        hitpoint,
+        update
+      }),
+      [hitpoint, update]
+    );
+    React.useImperativeHandle(fref, () => api, [api]);
+    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      debug ? fiber.createPortal(
+        /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("mesh", { ref: hitpointRef, children: [
+            /* @__PURE__ */ jsxRuntime.jsx("sphereGeometry", { args: [debug, 16, 16] }),
+            /* @__PURE__ */ jsxRuntime.jsx("meshBasicMaterial", { color: "#00ff00", opacity: 1, transparent: true, depthWrite: false })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("mesh", { ref: targetRef, children: [
+            /* @__PURE__ */ jsxRuntime.jsx("sphereGeometry", { args: [debug / 2, 16, 16] }),
+            /* @__PURE__ */ jsxRuntime.jsx("meshBasicMaterial", { color: "#00ff00", opacity: 0.5, transparent: true, depthWrite: false })
+          ] })
+        ] }),
+        scene
+      ) : null,
+      /* @__PURE__ */ jsxRuntime.jsx(DepthOfField.DepthOfField, { ref: dofRef, ...props, target: hitpoint })
+    ] });
+  }
+);
+exports.Autofocus = Autofocus;
+//# sourceMappingURL=Autofocus.cjs.map

package/dist/effects/Autofocus.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Autofocus.cjs","sources":["../../src/effects/Autofocus.tsx"],"sourcesContent":["import * as THREE from 'three'\nimport React, {\n  useRef,\n  useContext,\n  useState,\n  useEffect,\n  useCallback,\n  forwardRef,\n  useImperativeHandle,\n  RefObject,\n  useMemo,\n} from 'react'\nimport { useThree, useFrame, createPortal, Vector3 } from '@react-three/fiber'\nimport { CopyPass, DepthPickingPass, DepthOfFieldEffect } from 'postprocessing'\nimport { easing } from 'maath'\n\nimport { DepthOfField } from './DepthOfField'\nimport { EffectComposerContext } from '../EffectComposer'\n\nexport type AutofocusProps = React.ComponentProps<typeof DepthOfField> & {\n  target?: Vector3\n  /** should the target follow the pointer */\n  mouse?: boolean\n  /** size of the debug green point  */\n  debug?: number\n  /** manual update */\n  manual?: boolean\n  /** approximate time to reach the target */\n  smoothTime?: number\n}\n\nexport type AutofocusApi = {\n  dofRef: RefObject<DepthOfFieldEffect>\n  hitpoint: THREE.Vector3\n  update: (delta: number, updateTarget: boolean) => void\n}\n\nexport const Autofocus = forwardRef<AutofocusApi, AutofocusProps>(\n  (\n    { target = undefined, mouse: followMouse = false, debug = undefined, manual = false, smoothTime = 0.25, ...props },\n    fref\n  ) => {\n    const dofRef = useRef<DepthOfFieldEffect>(null)\n    const hitpointRef = useRef<THREE.Mesh>(null)\n    const targetRef = useRef<THREE.Mesh>(null)\n\n    const scene = useThree(({ scene }) => scene)\n    const pointer = useThree(({ pointer }) => pointer)\n    const { composer, camera } = useContext(EffectComposerContext)\n\n    // see: https://codesandbox.io/s/depthpickingpass-x130hg\n    const [depthPickingPass] = useState(() => new DepthPickingPass())\n    const [copyPass] = useState(() => new CopyPass())\n    useEffect(() => {\n      composer.addPass(depthPickingPass)\n      composer.addPass(copyPass)\n      return () => {\n        composer.removePass(depthPickingPass)\n        composer.removePass(copyPass)\n      }\n    }, [composer, depthPickingPass, copyPass])\n\n    useEffect(() => {\n      return () => {\n        depthPickingPass.dispose()\n        copyPass.dispose()\n      }\n    }, [depthPickingPass, copyPass])\n\n    const [hitpoint] = useState(() => new THREE.Vector3(0, 0, 0))\n\n    const [ndc] = useState(() => new THREE.Vector3(0, 0, 0))\n    const getHit = useCallback(\n      async (x: number, y: number) => {\n        ndc.x = x\n        ndc.y = y\n        ndc.z = await depthPickingPass.readDepth(ndc)\n        ndc.z = ndc.z * 2.0 - 1.0\n        const hit = 1 - ndc.z > 0.0000001 // it is missed if ndc.z is close to 1\n        return hit ? ndc.unproject(camera) : false\n      },\n      [ndc, depthPickingPass, camera]\n    )\n\n    const update = useCallback(\n      async (delta: number, updateTarget = true) => {\n        // Update hitpoint\n        if (target) {\n          hitpoint.set(...(target as [number, number, number]))\n        } else {\n          const { x, y } = followMouse ? pointer : { x: 0, y: 0 }\n          const hit = await getHit(x, y)\n          if (hit) hitpoint.copy(hit)\n        }\n\n        // Update target\n        if (updateTarget && dofRef.current?.target) {\n          if (smoothTime > 0 && delta > 0) {\n            easing.damp3(dofRef.current.target, hitpoint, smoothTime, delta)\n          } else {\n            dofRef.current.target.copy(hitpoint)\n          }\n        }\n      },\n      [target, hitpoint, followMouse, getHit, smoothTime, pointer]\n    )\n\n    useFrame(async (_, delta) => {\n      if (!manual) {\n        update(delta)\n      }\n      if (hitpointRef.current) {\n        hitpointRef.current.position.copy(hitpoint)\n      }\n      if (targetRef.current && dofRef.current?.target) {\n        targetRef.current.position.copy(dofRef.current.target)\n      }\n    })\n\n    // Ref API\n    const api = useMemo<AutofocusApi>(\n      () => ({\n        dofRef,\n        hitpoint,\n        update,\n      }),\n      [hitpoint, update]\n    )\n    useImperativeHandle(fref, () => api, [api])\n\n    return (\n      <>\n        {debug\n          ? createPortal(\n              <>\n                <mesh ref={hitpointRef}>\n                  <sphereGeometry args={[debug, 16, 16]} />\n                  <meshBasicMaterial color=\"#00ff00\" opacity={1} transparent depthWrite={false} />\n                </mesh>\n                <mesh ref={targetRef}>\n                  <sphereGeometry args={[debug / 2, 16, 16]} />\n                  <meshBasicMaterial color=\"#00ff00\" opacity={0.5} transparent depthWrite={false} />\n                </mesh>\n              </>,\n              scene\n            )\n          : null}\n\n        <DepthOfField ref={dofRef} {...props} target={hitpoint} />\n      </>\n    )\n  }\n)\n"],"names":["forwardRef","useRef","useThree","scene","pointer","useContext","EffectComposerContext","useState","DepthPickingPass","CopyPass","useEffect","THREE","useCallback","easing","useFrame","useMemo","useImperativeHandle","jsxs","Fragment","createPortal","jsx","DepthOfField"],"mappings":"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"}

package/dist/effects/Autofocus.js

@@ -0,0 +1,109 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import * as THREE from "three";
+import { forwardRef, useRef, useContext, useState, useEffect, useCallback, useMemo, useImperativeHandle } from "react";
+import { useThree, useFrame, createPortal } from "@react-three/fiber";
+import { DepthPickingPass, CopyPass } from "postprocessing";
+import { easing } from "maath";
+import { DepthOfField } from "./DepthOfField.js";
+import { EffectComposerContext } from "../EffectComposer.js";
+const Autofocus = forwardRef(
+  ({ target = void 0, mouse: followMouse = false, debug = void 0, manual = false, smoothTime = 0.25, ...props }, fref) => {
+    const dofRef = useRef(null);
+    const hitpointRef = useRef(null);
+    const targetRef = useRef(null);
+    const scene = useThree(({ scene: scene2 }) => scene2);
+    const pointer = useThree(({ pointer: pointer2 }) => pointer2);
+    const { composer, camera } = useContext(EffectComposerContext);
+    const [depthPickingPass] = useState(() => new DepthPickingPass());
+    const [copyPass] = useState(() => new CopyPass());
+    useEffect(() => {
+      composer.addPass(depthPickingPass);
+      composer.addPass(copyPass);
+      return () => {
+        composer.removePass(depthPickingPass);
+        composer.removePass(copyPass);
+      };
+    }, [composer, depthPickingPass, copyPass]);
+    useEffect(() => {
+      return () => {
+        depthPickingPass.dispose();
+        copyPass.dispose();
+      };
+    }, [depthPickingPass, copyPass]);
+    const [hitpoint] = useState(() => new THREE.Vector3(0, 0, 0));
+    const [ndc] = useState(() => new THREE.Vector3(0, 0, 0));
+    const getHit = useCallback(
+      async (x, y) => {
+        ndc.x = x;
+        ndc.y = y;
+        ndc.z = await depthPickingPass.readDepth(ndc);
+        ndc.z = ndc.z * 2 - 1;
+        const hit = 1 - ndc.z > 1e-7;
+        return hit ? ndc.unproject(camera) : false;
+      },
+      [ndc, depthPickingPass, camera]
+    );
+    const update = useCallback(
+      async (delta, updateTarget = true) => {
+        var _a;
+        if (target) {
+          hitpoint.set(...target);
+        } else {
+          const { x, y } = followMouse ? pointer : { x: 0, y: 0 };
+          const hit = await getHit(x, y);
+          if (hit)
+            hitpoint.copy(hit);
+        }
+        if (updateTarget && ((_a = dofRef.current) == null ? void 0 : _a.target)) {
+          if (smoothTime > 0 && delta > 0) {
+            easing.damp3(dofRef.current.target, hitpoint, smoothTime, delta);
+          } else {
+            dofRef.current.target.copy(hitpoint);
+          }
+        }
+      },
+      [target, hitpoint, followMouse, getHit, smoothTime, pointer]
+    );
+    useFrame(async (_, delta) => {
+      var _a;
+      if (!manual) {
+        update(delta);
+      }
+      if (hitpointRef.current) {
+        hitpointRef.current.position.copy(hitpoint);
+      }
+      if (targetRef.current && ((_a = dofRef.current) == null ? void 0 : _a.target)) {
+        targetRef.current.position.copy(dofRef.current.target);
+      }
+    });
+    const api = useMemo(
+      () => ({
+        dofRef,
+        hitpoint,
+        update
+      }),
+      [hitpoint, update]
+    );
+    useImperativeHandle(fref, () => api, [api]);
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      debug ? createPortal(
+        /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsxs("mesh", { ref: hitpointRef, children: [
+            /* @__PURE__ */ jsx("sphereGeometry", { args: [debug, 16, 16] }),
+            /* @__PURE__ */ jsx("meshBasicMaterial", { color: "#00ff00", opacity: 1, transparent: true, depthWrite: false })
+          ] }),
+          /* @__PURE__ */ jsxs("mesh", { ref: targetRef, children: [
+            /* @__PURE__ */ jsx("sphereGeometry", { args: [debug / 2, 16, 16] }),
+            /* @__PURE__ */ jsx("meshBasicMaterial", { color: "#00ff00", opacity: 0.5, transparent: true, depthWrite: false })
+          ] })
+        ] }),
+        scene
+      ) : null,
+      /* @__PURE__ */ jsx(DepthOfField, { ref: dofRef, ...props, target: hitpoint })
+    ] });
+  }
+);
+export {
+  Autofocus
+};
+//# sourceMappingURL=Autofocus.js.map

package/dist/effects/Autofocus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Autofocus.js","sources":["../../src/effects/Autofocus.tsx"],"sourcesContent":["import * as THREE from 'three'\nimport React, {\n  useRef,\n  useContext,\n  useState,\n  useEffect,\n  useCallback,\n  forwardRef,\n  useImperativeHandle,\n  RefObject,\n  useMemo,\n} from 'react'\nimport { useThree, useFrame, createPortal, Vector3 } from '@react-three/fiber'\nimport { CopyPass, DepthPickingPass, DepthOfFieldEffect } from 'postprocessing'\nimport { easing } from 'maath'\n\nimport { DepthOfField } from './DepthOfField'\nimport { EffectComposerContext } from '../EffectComposer'\n\nexport type AutofocusProps = React.ComponentProps<typeof DepthOfField> & {\n  target?: Vector3\n  /** should the target follow the pointer */\n  mouse?: boolean\n  /** size of the debug green point  */\n  debug?: number\n  /** manual update */\n  manual?: boolean\n  /** approximate time to reach the target */\n  smoothTime?: number\n}\n\nexport type AutofocusApi = {\n  dofRef: RefObject<DepthOfFieldEffect>\n  hitpoint: THREE.Vector3\n  update: (delta: number, updateTarget: boolean) => void\n}\n\nexport const Autofocus = forwardRef<AutofocusApi, AutofocusProps>(\n  (\n    { target = undefined, mouse: followMouse = false, debug = undefined, manual = false, smoothTime = 0.25, ...props },\n    fref\n  ) => {\n    const dofRef = useRef<DepthOfFieldEffect>(null)\n    const hitpointRef = useRef<THREE.Mesh>(null)\n    const targetRef = useRef<THREE.Mesh>(null)\n\n    const scene = useThree(({ scene }) => scene)\n    const pointer = useThree(({ pointer }) => pointer)\n    const { composer, camera } = useContext(EffectComposerContext)\n\n    // see: https://codesandbox.io/s/depthpickingpass-x130hg\n    const [depthPickingPass] = useState(() => new DepthPickingPass())\n    const [copyPass] = useState(() => new CopyPass())\n    useEffect(() => {\n      composer.addPass(depthPickingPass)\n      composer.addPass(copyPass)\n      return () => {\n        composer.removePass(depthPickingPass)\n        composer.removePass(copyPass)\n      }\n    }, [composer, depthPickingPass, copyPass])\n\n    useEffect(() => {\n      return () => {\n        depthPickingPass.dispose()\n        copyPass.dispose()\n      }\n    }, [depthPickingPass, copyPass])\n\n    const [hitpoint] = useState(() => new THREE.Vector3(0, 0, 0))\n\n    const [ndc] = useState(() => new THREE.Vector3(0, 0, 0))\n    const getHit = useCallback(\n      async (x: number, y: number) => {\n        ndc.x = x\n        ndc.y = y\n        ndc.z = await depthPickingPass.readDepth(ndc)\n        ndc.z = ndc.z * 2.0 - 1.0\n        const hit = 1 - ndc.z > 0.0000001 // it is missed if ndc.z is close to 1\n        return hit ? ndc.unproject(camera) : false\n      },\n      [ndc, depthPickingPass, camera]\n    )\n\n    const update = useCallback(\n      async (delta: number, updateTarget = true) => {\n        // Update hitpoint\n        if (target) {\n          hitpoint.set(...(target as [number, number, number]))\n        } else {\n          const { x, y } = followMouse ? pointer : { x: 0, y: 0 }\n          const hit = await getHit(x, y)\n          if (hit) hitpoint.copy(hit)\n        }\n\n        // Update target\n        if (updateTarget && dofRef.current?.target) {\n          if (smoothTime > 0 && delta > 0) {\n            easing.damp3(dofRef.current.target, hitpoint, smoothTime, delta)\n          } else {\n            dofRef.current.target.copy(hitpoint)\n          }\n        }\n      },\n      [target, hitpoint, followMouse, getHit, smoothTime, pointer]\n    )\n\n    useFrame(async (_, delta) => {\n      if (!manual) {\n        update(delta)\n      }\n      if (hitpointRef.current) {\n        hitpointRef.current.position.copy(hitpoint)\n      }\n      if (targetRef.current && dofRef.current?.target) {\n        targetRef.current.position.copy(dofRef.current.target)\n      }\n    })\n\n    // Ref API\n    const api = useMemo<AutofocusApi>(\n      () => ({\n        dofRef,\n        hitpoint,\n        update,\n      }),\n      [hitpoint, update]\n    )\n    useImperativeHandle(fref, () => api, [api])\n\n    return (\n      <>\n        {debug\n          ? createPortal(\n              <>\n                <mesh ref={hitpointRef}>\n                  <sphereGeometry args={[debug, 16, 16]} />\n                  <meshBasicMaterial color=\"#00ff00\" opacity={1} transparent depthWrite={false} />\n                </mesh>\n                <mesh ref={targetRef}>\n                  <sphereGeometry args={[debug / 2, 16, 16]} />\n                  <meshBasicMaterial color=\"#00ff00\" opacity={0.5} transparent depthWrite={false} />\n                </mesh>\n              </>,\n              scene\n            )\n          : null}\n\n        <DepthOfField ref={dofRef} {...props} target={hitpoint} />\n      </>\n    )\n  }\n)\n"],"names":["scene","pointer"],"mappings":"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"}

package/dist/effects/Bloom.cjs

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const postprocessing = require("postprocessing");
+const util = require("../util.cjs");
+const Bloom = util.wrapEffect(postprocessing.BloomEffect, {
+  blendFunction: postprocessing.BlendFunction.ADD
+});
+exports.Bloom = Bloom;
+//# sourceMappingURL=Bloom.cjs.map

package/dist/effects/Bloom.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Bloom.cjs","sources":["../../src/effects/Bloom.tsx"],"sourcesContent":["import { BloomEffect, BlendFunction } from 'postprocessing'\nimport { wrapEffect } from '../util'\n\nexport const Bloom = wrapEffect(BloomEffect, {\n  blendFunction: BlendFunction.ADD,\n})\n"],"names":["wrapEffect","BloomEffect","BlendFunction"],"mappings":";;;;AAGa,MAAA,QAAQA,gBAAWC,4BAAa;AAAA,EAC3C,eAAeC,eAAc,cAAA;AAC/B,CAAC;;"}

package/dist/effects/Bloom.js

@@ -0,0 +1,9 @@
+import { BlendFunction, BloomEffect } from "postprocessing";
+import { wrapEffect } from "../util.js";
+const Bloom = wrapEffect(BloomEffect, {
+  blendFunction: BlendFunction.ADD
+});
+export {
+  Bloom
+};
+//# sourceMappingURL=Bloom.js.map

package/dist/effects/Bloom.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Bloom.js","sources":["../../src/effects/Bloom.tsx"],"sourcesContent":["import { BloomEffect, BlendFunction } from 'postprocessing'\nimport { wrapEffect } from '../util'\n\nexport const Bloom = wrapEffect(BloomEffect, {\n  blendFunction: BlendFunction.ADD,\n})\n"],"names":[],"mappings":";;AAGa,MAAA,QAAQ,WAAW,aAAa;AAAA,EAC3C,eAAe,cAAc;AAC/B,CAAC;"}

package/dist/effects/BrightnessContrast.cjs

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const postprocessing = require("postprocessing");
+const util = require("../util.cjs");
+const BrightnessContrast = util.wrapEffect(postprocessing.BrightnessContrastEffect);
+exports.BrightnessContrast = BrightnessContrast;
+//# sourceMappingURL=BrightnessContrast.cjs.map

package/dist/effects/BrightnessContrast.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BrightnessContrast.cjs","sources":["../../src/effects/BrightnessContrast.tsx"],"sourcesContent":["import { BrightnessContrastEffect } from 'postprocessing'\nimport { wrapEffect } from '../util'\n\nexport const BrightnessContrast = wrapEffect(BrightnessContrastEffect)\n"],"names":["wrapEffect","BrightnessContrastEffect"],"mappings":";;;;AAGa,MAAA,qBAAqBA,gBAAWC,eAAwB,wBAAA;;"}

package/dist/effects/BrightnessContrast.js

@@ -0,0 +1,7 @@
+import { BrightnessContrastEffect } from "postprocessing";
+import { wrapEffect } from "../util.js";
+const BrightnessContrast = wrapEffect(BrightnessContrastEffect);
+export {
+  BrightnessContrast
+};
+//# sourceMappingURL=BrightnessContrast.js.map

package/dist/effects/BrightnessContrast.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BrightnessContrast.js","sources":["../../src/effects/BrightnessContrast.tsx"],"sourcesContent":["import { BrightnessContrastEffect } from 'postprocessing'\nimport { wrapEffect } from '../util'\n\nexport const BrightnessContrast = wrapEffect(BrightnessContrastEffect)\n"],"names":[],"mappings":";;AAGa,MAAA,qBAAqB,WAAW,wBAAwB;"}

package/dist/effects/ChromaticAberration.cjs

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const postprocessing = require("postprocessing");
+const util = require("../util.cjs");
+const ChromaticAberration = util.wrapEffect(postprocessing.ChromaticAberrationEffect);
+exports.ChromaticAberration = ChromaticAberration;
+//# sourceMappingURL=ChromaticAberration.cjs.map

package/dist/effects/ChromaticAberration.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChromaticAberration.cjs","sources":["../../src/effects/ChromaticAberration.tsx"],"sourcesContent":["import { ChromaticAberrationEffect } from 'postprocessing'\nimport { type EffectProps, wrapEffect } from '../util'\n\nexport type ChromaticAberrationProps = EffectProps<typeof ChromaticAberrationEffect>\nexport const ChromaticAberration = wrapEffect(ChromaticAberrationEffect)\n"],"names":["wrapEffect","ChromaticAberrationEffect"],"mappings":";;;;AAIa,MAAA,sBAAsBA,gBAAWC,eAAyB,yBAAA;;"}

package/dist/effects/ChromaticAberration.js

@@ -0,0 +1,7 @@
+import { ChromaticAberrationEffect } from "postprocessing";
+import { wrapEffect } from "../util.js";
+const ChromaticAberration = wrapEffect(ChromaticAberrationEffect);
+export {
+  ChromaticAberration
+};
+//# sourceMappingURL=ChromaticAberration.js.map

package/dist/effects/ChromaticAberration.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChromaticAberration.js","sources":["../../src/effects/ChromaticAberration.tsx"],"sourcesContent":["import { ChromaticAberrationEffect } from 'postprocessing'\nimport { type EffectProps, wrapEffect } from '../util'\n\nexport type ChromaticAberrationProps = EffectProps<typeof ChromaticAberrationEffect>\nexport const ChromaticAberration = wrapEffect(ChromaticAberrationEffect)\n"],"names":[],"mappings":";;AAIa,MAAA,sBAAsB,WAAW,yBAAyB;"}

package/dist/effects/ColorAverage.cjs

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const postprocessing = require("postprocessing");
+const React = require("react");
+const ColorAverage = React.forwardRef(function ColorAverage2({ blendFunction = postprocessing.BlendFunction.NORMAL }, ref) {
+  const effect = React.useMemo(() => new postprocessing.ColorAverageEffect(blendFunction), [blendFunction]);
+  return /* @__PURE__ */ jsxRuntime.jsx("primitive", { ref, object: effect, dispose: null });
+});
+exports.ColorAverage = ColorAverage;
+//# sourceMappingURL=ColorAverage.cjs.map

package/dist/effects/ColorAverage.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorAverage.cjs","sources":["../../src/effects/ColorAverage.tsx"],"sourcesContent":["import { ColorAverageEffect, BlendFunction } from 'postprocessing'\nimport React, { Ref, forwardRef, useMemo } from 'react'\n\nexport type ColorAverageProps = Partial<{\n  blendFunction: BlendFunction\n}>\n\nexport const ColorAverage = forwardRef<ColorAverageEffect, ColorAverageProps>(function ColorAverage(\n  { blendFunction = BlendFunction.NORMAL }: ColorAverageProps,\n  ref: Ref<ColorAverageEffect>\n) {\n  /** Because ColorAverage blendFunction is not an object but a number, we have to define a custom prop \"blendFunction\" */\n  const effect = useMemo(() => new ColorAverageEffect(blendFunction), [blendFunction])\n  return <primitive ref={ref} object={effect} dispose={null} />\n})\n"],"names":["forwardRef","ColorAverage","BlendFunction","useMemo","ColorAverageEffect"],"mappings":";;;;;AAOa,MAAA,eAAeA,MAAAA,WAAkD,SAASC,cACrF,EAAE,gBAAgBC,6BAAc,OAAO,GACvC,KACA;AAEM,QAAA,SAASC,cAAQ,MAAM,IAAIC,eAAAA,mBAAmB,aAAa,GAAG,CAAC,aAAa,CAAC;AACnF,wCAAQ,aAAU,EAAA,KAAU,QAAQ,QAAQ,SAAS,KAAM,CAAA;AAC7D,CAAC;;"}

package/dist/effects/ColorAverage.js

@@ -0,0 +1,11 @@
+import { jsx } from "react/jsx-runtime";
+import { ColorAverageEffect, BlendFunction } from "postprocessing";
+import { forwardRef, useMemo } from "react";
+const ColorAverage = forwardRef(function ColorAverage2({ blendFunction = BlendFunction.NORMAL }, ref) {
+  const effect = useMemo(() => new ColorAverageEffect(blendFunction), [blendFunction]);
+  return /* @__PURE__ */ jsx("primitive", { ref, object: effect, dispose: null });
+});
+export {
+  ColorAverage
+};
+//# sourceMappingURL=ColorAverage.js.map

package/dist/effects/ColorAverage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorAverage.js","sources":["../../src/effects/ColorAverage.tsx"],"sourcesContent":["import { ColorAverageEffect, BlendFunction } from 'postprocessing'\nimport React, { Ref, forwardRef, useMemo } from 'react'\n\nexport type ColorAverageProps = Partial<{\n  blendFunction: BlendFunction\n}>\n\nexport const ColorAverage = forwardRef<ColorAverageEffect, ColorAverageProps>(function ColorAverage(\n  { blendFunction = BlendFunction.NORMAL }: ColorAverageProps,\n  ref: Ref<ColorAverageEffect>\n) {\n  /** Because ColorAverage blendFunction is not an object but a number, we have to define a custom prop \"blendFunction\" */\n  const effect = useMemo(() => new ColorAverageEffect(blendFunction), [blendFunction])\n  return <primitive ref={ref} object={effect} dispose={null} />\n})\n"],"names":["ColorAverage"],"mappings":";;;AAOa,MAAA,eAAe,WAAkD,SAASA,cACrF,EAAE,gBAAgB,cAAc,OAAO,GACvC,KACA;AAEM,QAAA,SAAS,QAAQ,MAAM,IAAI,mBAAmB,aAAa,GAAG,CAAC,aAAa,CAAC;AACnF,6BAAQ,aAAU,EAAA,KAAU,QAAQ,QAAQ,SAAS,KAAM,CAAA;AAC7D,CAAC;"}

package/dist/effects/ColorDepth.cjs

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const postprocessing = require("postprocessing");
+const util = require("../util.cjs");
+const ColorDepth = util.wrapEffect(postprocessing.ColorDepthEffect);
+exports.ColorDepth = ColorDepth;
+//# sourceMappingURL=ColorDepth.cjs.map

package/dist/effects/ColorDepth.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorDepth.cjs","sources":["../../src/effects/ColorDepth.tsx"],"sourcesContent":["import { ColorDepthEffect } from 'postprocessing'\nimport { wrapEffect } from '../util'\n\nexport const ColorDepth = wrapEffect(ColorDepthEffect)\n"],"names":["wrapEffect","ColorDepthEffect"],"mappings":";;;;AAGa,MAAA,aAAaA,gBAAWC,eAAgB,gBAAA;;"}

package/dist/effects/ColorDepth.js

@@ -0,0 +1,7 @@
+import { ColorDepthEffect } from "postprocessing";
+import { wrapEffect } from "../util.js";
+const ColorDepth = wrapEffect(ColorDepthEffect);
+export {
+  ColorDepth
+};
+//# sourceMappingURL=ColorDepth.js.map

package/dist/effects/ColorDepth.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorDepth.js","sources":["../../src/effects/ColorDepth.tsx"],"sourcesContent":["import { ColorDepthEffect } from 'postprocessing'\nimport { wrapEffect } from '../util'\n\nexport const ColorDepth = wrapEffect(ColorDepthEffect)\n"],"names":[],"mappings":";;AAGa,MAAA,aAAa,WAAW,gBAAgB;"}

package/dist/effects/Depth.cjs

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const postprocessing = require("postprocessing");
+const util = require("../util.cjs");
+const Depth = util.wrapEffect(postprocessing.DepthEffect);
+exports.Depth = Depth;
+//# sourceMappingURL=Depth.cjs.map

package/dist/effects/Depth.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Depth.cjs","sources":["../../src/effects/Depth.tsx"],"sourcesContent":["import { DepthEffect } from 'postprocessing'\nimport { wrapEffect } from '../util'\n\nexport const Depth = wrapEffect(DepthEffect)\n"],"names":["wrapEffect","DepthEffect"],"mappings":";;;;AAGa,MAAA,QAAQA,gBAAWC,eAAW,WAAA;;"}

package/dist/effects/Depth.js

@@ -0,0 +1,7 @@
+import { DepthEffect } from "postprocessing";
+import { wrapEffect } from "../util.js";
+const Depth = wrapEffect(DepthEffect);
+export {
+  Depth
+};
+//# sourceMappingURL=Depth.js.map

package/dist/effects/Depth.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Depth.js","sources":["../../src/effects/Depth.tsx"],"sourcesContent":["import { DepthEffect } from 'postprocessing'\nimport { wrapEffect } from '../util'\n\nexport const Depth = wrapEffect(DepthEffect)\n"],"names":[],"mappings":";;AAGa,MAAA,QAAQ,WAAW,WAAW;"}

package/dist/effects/DepthOfField.cjs

@@ -0,0 +1,74 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const postprocessing = require("postprocessing");
+const React = require("react");
+const THREE = require("three");
+const EffectComposer = require("../EffectComposer.cjs");
+const DepthOfField = React.forwardRef(function DepthOfField2({
+  blendFunction,
+  worldFocusDistance,
+  worldFocusRange,
+  focusDistance,
+  focusRange,
+  focalLength,
+  bokehScale,
+  resolutionScale,
+  resolutionX,
+  resolutionY,
+  width,
+  height,
+  target,
+  depthTexture,
+  ...props
+}, ref) {
+  const { camera } = React.useContext(EffectComposer.EffectComposerContext);
+  const autoFocus = target != null;
+  const effect = React.useMemo(() => {
+    const effect2 = new postprocessing.DepthOfFieldEffect(camera, {
+      blendFunction,
+      worldFocusDistance,
+      worldFocusRange,
+      focusDistance,
+      focusRange,
+      focalLength,
+      bokehScale,
+      resolutionScale,
+      resolutionX,
+      resolutionY,
+      width,
+      height
+    });
+    if (autoFocus)
+      effect2.target = new THREE.Vector3();
+    if (depthTexture)
+      effect2.setDepthTexture(depthTexture.texture, depthTexture.packing);
+    const maskMaterial = effect2.maskPass.getFullscreenMaterial();
+    maskMaterial.maskFunction = postprocessing.MaskFunction.MULTIPLY_RGB_SET_ALPHA;
+    return effect2;
+  }, [
+    camera,
+    blendFunction,
+    worldFocusDistance,
+    worldFocusRange,
+    focusDistance,
+    focusRange,
+    focalLength,
+    bokehScale,
+    resolutionScale,
+    resolutionX,
+    resolutionY,
+    width,
+    height,
+    autoFocus,
+    depthTexture
+  ]);
+  React.useEffect(() => {
+    return () => {
+      effect.dispose();
+    };
+  }, [effect]);
+  return /* @__PURE__ */ jsxRuntime.jsx("primitive", { ...props, ref, object: effect, target });
+});
+exports.DepthOfField = DepthOfField;
+//# sourceMappingURL=DepthOfField.cjs.map

package/dist/effects/DepthOfField.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DepthOfField.cjs","sources":["../../src/effects/DepthOfField.tsx"],"sourcesContent":["import { DepthOfFieldEffect, MaskFunction } from 'postprocessing'\nimport { Ref, forwardRef, useMemo, useEffect, useContext } from 'react'\nimport { ReactThreeFiber } from '@react-three/fiber'\nimport { type DepthPackingStrategies, type Texture, Vector3 } from 'three'\nimport { EffectComposerContext } from '../EffectComposer'\n\ntype DOFProps = ConstructorParameters<typeof DepthOfFieldEffect>[1] &\n  Partial<{\n    target: ReactThreeFiber.Vector3\n    depthTexture: {\n      texture: Texture\n      // TODO: narrow to DepthPackingStrategies\n      packing: number\n    }\n    // TODO: not used\n    blur: number\n  }>\n\nexport const DepthOfField = forwardRef(function DepthOfField(\n  {\n    blendFunction,\n    worldFocusDistance,\n    worldFocusRange,\n    focusDistance,\n    focusRange,\n    focalLength,\n    bokehScale,\n    resolutionScale,\n    resolutionX,\n    resolutionY,\n    width,\n    height,\n    target,\n    depthTexture,\n    ...props\n  }: DOFProps,\n  ref: Ref<DepthOfFieldEffect>\n) {\n  const { camera } = useContext(EffectComposerContext)\n  const autoFocus = target != null\n  const effect = useMemo(() => {\n    const effect = new DepthOfFieldEffect(camera, {\n      blendFunction,\n      worldFocusDistance,\n      worldFocusRange,\n      focusDistance,\n      focusRange,\n      focalLength,\n      bokehScale,\n      resolutionScale,\n      resolutionX,\n      resolutionY,\n      width,\n      height,\n    })\n    // Creating a target enables autofocus, R3F will set via props\n    if (autoFocus) effect.target = new Vector3()\n    // Depth texture for depth picking with optional packing strategy\n    if (depthTexture) effect.setDepthTexture(depthTexture.texture, depthTexture.packing as DepthPackingStrategies)\n    // Temporary fix that restores DOF 6.21.3 behavior, everything since then lets shapes leak through the blur\n    const maskMaterial = (effect as any).maskPass.getFullscreenMaterial()\n    maskMaterial.maskFunction = MaskFunction.MULTIPLY_RGB_SET_ALPHA\n    return effect\n  }, [\n    camera,\n    blendFunction,\n    worldFocusDistance,\n    worldFocusRange,\n    focusDistance,\n    focusRange,\n    focalLength,\n    bokehScale,\n    resolutionScale,\n    resolutionX,\n    resolutionY,\n    width,\n    height,\n    autoFocus,\n    depthTexture,\n  ])\n\n  useEffect(() => {\n    return () => {\n      effect.dispose()\n    }\n  }, [effect])\n\n  return <primitive {...props} ref={ref} object={effect} target={target} />\n})\n"],"names":["forwardRef","DepthOfField","useContext","EffectComposerContext","useMemo","effect","DepthOfFieldEffect","Vector3","MaskFunction","useEffect"],"mappings":";;;;;;;AAkBa,MAAA,eAAeA,MAAAA,WAAW,SAASC,cAC9C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;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,EAAE,OAAA,IAAWC,MAAA,WAAWC,eAAqB,qBAAA;AACnD,QAAM,YAAY,UAAU;AACtB,QAAA,SAASC,MAAAA,QAAQ,MAAM;AACrBC,UAAAA,UAAS,IAAIC,eAAA,mBAAmB,QAAQ;AAAA,MAC5C;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA,CACD;AAEG,QAAA;AAAWD,cAAO,SAAS,IAAIE,MAAAA;AAE/B,QAAA;AAAcF,cAAO,gBAAgB,aAAa,SAAS,aAAa,OAAiC;AAEvG,UAAA,eAAgBA,QAAe,SAAS,sBAAsB;AACpE,iBAAa,eAAeG,eAAa,aAAA;AAClCH,WAAAA;AAAAA,EAAA,GACN;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,CACD;AAEDI,QAAAA,UAAU,MAAM;AACd,WAAO,MAAM;AACX,aAAO,QAAQ;AAAA,IAAA;AAAA,EACjB,GACC,CAAC,MAAM,CAAC;AAEX,wCAAQ,aAAW,EAAA,GAAG,OAAO,KAAU,QAAQ,QAAQ,OAAgB,CAAA;AACzE,CAAC;;"}

package/dist/effects/DepthOfField.js

@@ -0,0 +1,74 @@
+import { jsx } from "react/jsx-runtime";
+import { DepthOfFieldEffect, MaskFunction } from "postprocessing";
+import { forwardRef, useContext, useMemo, useEffect } from "react";
+import { Vector3 } from "three";
+import { EffectComposerContext } from "../EffectComposer.js";
+const DepthOfField = forwardRef(function DepthOfField2({
+  blendFunction,
+  worldFocusDistance,
+  worldFocusRange,
+  focusDistance,
+  focusRange,
+  focalLength,
+  bokehScale,
+  resolutionScale,
+  resolutionX,
+  resolutionY,
+  width,
+  height,
+  target,
+  depthTexture,
+  ...props
+}, ref) {
+  const { camera } = useContext(EffectComposerContext);
+  const autoFocus = target != null;
+  const effect = useMemo(() => {
+    const effect2 = new DepthOfFieldEffect(camera, {
+      blendFunction,
+      worldFocusDistance,
+      worldFocusRange,
+      focusDistance,
+      focusRange,
+      focalLength,
+      bokehScale,
+      resolutionScale,
+      resolutionX,
+      resolutionY,
+      width,
+      height
+    });
+    if (autoFocus)
+      effect2.target = new Vector3();
+    if (depthTexture)
+      effect2.setDepthTexture(depthTexture.texture, depthTexture.packing);
+    const maskMaterial = effect2.maskPass.getFullscreenMaterial();
+    maskMaterial.maskFunction = MaskFunction.MULTIPLY_RGB_SET_ALPHA;
+    return effect2;
+  }, [
+    camera,
+    blendFunction,
+    worldFocusDistance,
+    worldFocusRange,
+    focusDistance,
+    focusRange,
+    focalLength,
+    bokehScale,
+    resolutionScale,
+    resolutionX,
+    resolutionY,
+    width,
+    height,
+    autoFocus,
+    depthTexture
+  ]);
+  useEffect(() => {
+    return () => {
+      effect.dispose();
+    };
+  }, [effect]);
+  return /* @__PURE__ */ jsx("primitive", { ...props, ref, object: effect, target });
+});
+export {
+  DepthOfField
+};
+//# sourceMappingURL=DepthOfField.js.map

package/dist/effects/DepthOfField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DepthOfField.js","sources":["../../src/effects/DepthOfField.tsx"],"sourcesContent":["import { DepthOfFieldEffect, MaskFunction } from 'postprocessing'\nimport { Ref, forwardRef, useMemo, useEffect, useContext } from 'react'\nimport { ReactThreeFiber } from '@react-three/fiber'\nimport { type DepthPackingStrategies, type Texture, Vector3 } from 'three'\nimport { EffectComposerContext } from '../EffectComposer'\n\ntype DOFProps = ConstructorParameters<typeof DepthOfFieldEffect>[1] &\n  Partial<{\n    target: ReactThreeFiber.Vector3\n    depthTexture: {\n      texture: Texture\n      // TODO: narrow to DepthPackingStrategies\n      packing: number\n    }\n    // TODO: not used\n    blur: number\n  }>\n\nexport const DepthOfField = forwardRef(function DepthOfField(\n  {\n    blendFunction,\n    worldFocusDistance,\n    worldFocusRange,\n    focusDistance,\n    focusRange,\n    focalLength,\n    bokehScale,\n    resolutionScale,\n    resolutionX,\n    resolutionY,\n    width,\n    height,\n    target,\n    depthTexture,\n    ...props\n  }: DOFProps,\n  ref: Ref<DepthOfFieldEffect>\n) {\n  const { camera } = useContext(EffectComposerContext)\n  const autoFocus = target != null\n  const effect = useMemo(() => {\n    const effect = new DepthOfFieldEffect(camera, {\n      blendFunction,\n      worldFocusDistance,\n      worldFocusRange,\n      focusDistance,\n      focusRange,\n      focalLength,\n      bokehScale,\n      resolutionScale,\n      resolutionX,\n      resolutionY,\n      width,\n      height,\n    })\n    // Creating a target enables autofocus, R3F will set via props\n    if (autoFocus) effect.target = new Vector3()\n    // Depth texture for depth picking with optional packing strategy\n    if (depthTexture) effect.setDepthTexture(depthTexture.texture, depthTexture.packing as DepthPackingStrategies)\n    // Temporary fix that restores DOF 6.21.3 behavior, everything since then lets shapes leak through the blur\n    const maskMaterial = (effect as any).maskPass.getFullscreenMaterial()\n    maskMaterial.maskFunction = MaskFunction.MULTIPLY_RGB_SET_ALPHA\n    return effect\n  }, [\n    camera,\n    blendFunction,\n    worldFocusDistance,\n    worldFocusRange,\n    focusDistance,\n    focusRange,\n    focalLength,\n    bokehScale,\n    resolutionScale,\n    resolutionX,\n    resolutionY,\n    width,\n    height,\n    autoFocus,\n    depthTexture,\n  ])\n\n  useEffect(() => {\n    return () => {\n      effect.dispose()\n    }\n  }, [effect])\n\n  return <primitive {...props} ref={ref} object={effect} target={target} />\n})\n"],"names":["DepthOfField","effect"],"mappings":";;;;;AAkBa,MAAA,eAAe,WAAW,SAASA,cAC9C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;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,EAAE,OAAA,IAAW,WAAW,qBAAqB;AACnD,QAAM,YAAY,UAAU;AACtB,QAAA,SAAS,QAAQ,MAAM;AACrBC,UAAAA,UAAS,IAAI,mBAAmB,QAAQ;AAAA,MAC5C;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA,CACD;AAEG,QAAA;AAAWA,cAAO,SAAS,IAAI;AAE/B,QAAA;AAAcA,cAAO,gBAAgB,aAAa,SAAS,aAAa,OAAiC;AAEvG,UAAA,eAAgBA,QAAe,SAAS,sBAAsB;AACpE,iBAAa,eAAe,aAAa;AAClCA,WAAAA;AAAAA,EAAA,GACN;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,CACD;AAED,YAAU,MAAM;AACd,WAAO,MAAM;AACX,aAAO,QAAQ;AAAA,IAAA;AAAA,EACjB,GACC,CAAC,MAAM,CAAC;AAEX,6BAAQ,aAAW,EAAA,GAAG,OAAO,KAAU,QAAQ,QAAQ,OAAgB,CAAA;AACzE,CAAC;"}

package/dist/effects/DotScreen.cjs

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const postprocessing = require("postprocessing");
+const util = require("../util.cjs");
+const DotScreen = util.wrapEffect(postprocessing.DotScreenEffect);
+exports.DotScreen = DotScreen;
+//# sourceMappingURL=DotScreen.cjs.map

package/dist/effects/DotScreen.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DotScreen.cjs","sources":["../../src/effects/DotScreen.tsx"],"sourcesContent":["import { DotScreenEffect } from 'postprocessing'\nimport { wrapEffect } from '../util'\n\nexport const DotScreen = wrapEffect(DotScreenEffect)\n"],"names":["wrapEffect","DotScreenEffect"],"mappings":";;;;AAGa,MAAA,YAAYA,gBAAWC,eAAe,eAAA;;"}

package/dist/effects/DotScreen.js

@@ -0,0 +1,7 @@
+import { DotScreenEffect } from "postprocessing";
+import { wrapEffect } from "../util.js";
+const DotScreen = wrapEffect(DotScreenEffect);
+export {
+  DotScreen
+};
+//# sourceMappingURL=DotScreen.js.map

package/dist/effects/DotScreen.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DotScreen.js","sources":["../../src/effects/DotScreen.tsx"],"sourcesContent":["import { DotScreenEffect } from 'postprocessing'\nimport { wrapEffect } from '../util'\n\nexport const DotScreen = wrapEffect(DotScreenEffect)\n"],"names":[],"mappings":";;AAGa,MAAA,YAAY,WAAW,eAAe;"}