@tresjs/post-processing 0.1.0 → 0.2.1

package/README.md

@@ -1,14 +1,14 @@
 ![repository-banner.png](/public/repo-banner.png)
 
 <p align="center">
-  <a href="https://www.npmjs.com/package/@tresjs/core"><img src="https://img.shields.io/npm/v/@tresjs/core?color=%2382DBCA" alt="npm package"></a>
+  <a href="https://www.npmjs.com/package/@tresjs/core"><img src="https://img.shields.io/npm/v/@tresjs/post-processing?color=%2382DBCA" alt="npm package"></a>
 
-<a href="https://discord.gg/tfY9aSNT"><img src="https://img.shields.io/badge/chat-discord-purple?style=flat&logo=discord" alt="discord chat"></a>
+<a href="https://discord.gg/UCr96AQmWn"><img src="https://img.shields.io/badge/chat-discord-purple?style=flat&logo=discord" alt="discord chat"></a>
 
 </p>
 <br/>
 
-# Post-Processing
+# Post-Processing WIP
 
 > Collection of useful helpers and fully functional, ready-made abstractions for Tres
 

package/dist/core/EffectComposer.vue.d.ts

@@ -0,0 +1,108 @@
+import type { PropType as __PropType } from 'vue';
+import { Scene } from 'three';
+import { TresCamera, TresObject } from '@tresjs/core';
+export type EffectComposerProps = {
+    enabled?: boolean;
+    children?: TresObject[];
+    depthBuffer?: boolean;
+    dissableNormalPass?: boolean;
+    stencilBuffer?: boolean;
+    resolutionScale?: number;
+    autoClear?: boolean;
+    multisampling?: number;
+    frameBufferType?: number;
+    scene?: Scene;
+    camera?: TresCamera;
+};
+declare const _sfc_main: import("vue").DefineComponent<{
+    enabled: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    children: {
+        type: __PropType<TresObject[] | undefined>;
+        required: false;
+    };
+    depthBuffer: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    dissableNormalPass: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    stencilBuffer: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    resolutionScale: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    autoClear: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    multisampling: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    frameBufferType: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    scene: {
+        type: __PropType<Scene | undefined>;
+        required: false;
+    };
+    camera: {
+        type: __PropType<TresCamera | undefined>;
+        required: false;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    enabled: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    children: {
+        type: __PropType<TresObject[] | undefined>;
+        required: false;
+    };
+    depthBuffer: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    dissableNormalPass: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    stencilBuffer: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    resolutionScale: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    autoClear: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    multisampling: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    frameBufferType: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    scene: {
+        type: __PropType<Scene | undefined>;
+        required: false;
+    };
+    camera: {
+        type: __PropType<TresCamera | undefined>;
+        required: false;
+    };
+}>>, {}, {}>;
+export default _sfc_main;

package/dist/core/effects/Bloom.vue.d.ts

@@ -0,0 +1,146 @@
+import type { PropType as __PropType } from 'vue';
+import { BlurPass, KernelSize, BlendFunction } from 'postprocessing';
+export type BloomProps = {
+    blendFunction?: BlendFunction;
+    /**
+     * The intensity of the bloom effect.
+     *
+     * @default 1
+     * @type {number}
+     * @memberof BloomProps
+     */
+    intensity?: number;
+    /**
+     *  An efficient, incremental blur pass.
+     *
+     * @type {BlurPass}
+     * @memberof BloomProps
+     */
+    blurPass?: BlurPass;
+    /**
+     * The width of the render
+     *
+     * @type {number}
+     * @memberof BloomProps
+     */
+    width?: number;
+    /**
+     * The height of the render
+     *
+     * @type {number}
+     * @memberof BloomProps
+     */
+    height?: number;
+    /**
+     * The kernel size.
+     *
+     * @default KernelSize.LARGE
+     *
+     * @type {KernelSize}
+     * @memberof BloomProps
+     */
+    kernelSize?: KernelSize;
+    /**
+     * The luminance threshold. Raise this value to mask out darker elements in the scene. Range is [0, 1].
+     *
+     * @default 0.9
+     *
+     * @type {number}
+     * @memberof BloomProps
+     */
+    luminanceThreshold?: number;
+    /**
+     * Controls the smoothness of the luminance threshold. Range is [0, 1].
+     *
+     * @default 0.025
+     *
+     * @type {number}
+     * @memberof BloomProps
+     */
+    luminanceSmoothing?: number;
+    /**
+     * Enables mip map blur.
+     *
+     * @default false
+     *
+     * @type {boolean}
+     * @memberof BloomProps
+     */
+    mipmapBlur?: boolean;
+};
+declare const _sfc_main: import("vue").DefineComponent<{
+    blendFunction: {
+        type: __PropType<BlendFunction | undefined>;
+        required: false;
+    };
+    intensity: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    blurPass: {
+        type: __PropType<import("postprocessing").KawaseBlurPass | undefined>;
+        required: false;
+    };
+    width: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    height: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    kernelSize: {
+        type: __PropType<KernelSize | undefined>;
+        required: false;
+    };
+    luminanceThreshold: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    luminanceSmoothing: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    mipmapBlur: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    blendFunction: {
+        type: __PropType<BlendFunction | undefined>;
+        required: false;
+    };
+    intensity: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    blurPass: {
+        type: __PropType<import("postprocessing").KawaseBlurPass | undefined>;
+        required: false;
+    };
+    width: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    height: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    kernelSize: {
+        type: __PropType<KernelSize | undefined>;
+        required: false;
+    };
+    luminanceThreshold: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    luminanceSmoothing: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    mipmapBlur: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+}>>, {}, {}>;
+export default _sfc_main;

package/dist/core/effects/Glitch.vue.d.ts

@@ -0,0 +1,183 @@
+import type { PropType as __PropType } from 'vue';
+import { GlitchMode, BlendFunction } from 'postprocessing';
+import { Vector2, Texture } from 'three';
+export interface GlitchProps {
+    blendFunction?: BlendFunction;
+    /**
+     *  The minimum and maximum delay between glitch activations in seconds.
+     *
+     * @default [1.5, 3.5]
+     *
+     * @type {Vector2}
+     * @memberof GlitchProps
+     */
+    delay?: Vector2;
+    /**
+     * The minimum and maximum duration of a glitch in seconds.
+     *
+     * @default [0.6, 1.0]
+     *
+     * @type {Vector2}
+     * @memberof GlitchProps
+     */
+    duration?: Vector2;
+    /**
+     * The strength of weak and strong glitches.
+     *
+     * @default [0.3, 1.0]
+     *
+     * @type {Vector2}
+     * @memberof GlitchProps
+     */
+    strength?: Vector2;
+    /**
+     * The glitch mode. Can be DISABLED | SPORADIC | CONSTANT_MILD | CONSTANT_WILD .
+     *
+     * @default GlitchMode.SPORADIC
+     *
+     * @type {GlitchMode}
+     * @memberof GlitchProps
+     */
+    mode?: GlitchMode;
+    /**
+     * Turn the effect on and off.
+     *
+     * @type {boolean}
+     * @memberof GlitchProps
+     */
+    active?: boolean;
+    /**
+     *
+     * The threshold for strong glitches.
+     *
+     * @default 0.85
+     *
+     * @type {number}
+     * @memberof GlitchProps
+     */
+    ratio?: number;
+    /**
+     * The scale of the blocky glitch columns.
+     *
+     * @default 0.05
+     *
+     * @type {number}
+     * @memberof GlitchProps
+     */
+    columns?: number;
+    /**
+     * A chromatic aberration offset. If provided, the glitch effect will influence this offset.
+     *
+     * @type {Vector2}
+     * @memberof GlitchProps
+     */
+    chromaticAberrationOffset?: Vector2;
+    /**
+     * A perturbation map. If none is provided, a noise texture will be created.
+     *
+     * @type {Texture}
+     * @memberof GlitchProps
+     */
+    peturbationMap?: Texture;
+    /**
+     * The size of the generated noise map. Will be ignored if a perturbation map is provided.
+     *
+     * @default 64
+     *
+     * @type {number}
+     * @memberof GlitchProps
+     */
+    dtSize?: number;
+}
+declare const _sfc_main: import("vue").DefineComponent<{
+    blendFunction: {
+        type: __PropType<BlendFunction | undefined>;
+        required: false;
+    };
+    delay: {
+        type: __PropType<Vector2 | undefined>;
+        required: false;
+    };
+    duration: {
+        type: __PropType<Vector2 | undefined>;
+        required: false;
+    };
+    strength: {
+        type: __PropType<Vector2 | undefined>;
+        required: false;
+    };
+    mode: {
+        type: __PropType<GlitchMode | undefined>;
+        required: false;
+    };
+    active: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    ratio: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    columns: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    chromaticAberrationOffset: {
+        type: __PropType<Vector2 | undefined>;
+        required: false;
+    };
+    peturbationMap: {
+        type: __PropType<Texture | undefined>;
+        required: false;
+    };
+    dtSize: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    blendFunction: {
+        type: __PropType<BlendFunction | undefined>;
+        required: false;
+    };
+    delay: {
+        type: __PropType<Vector2 | undefined>;
+        required: false;
+    };
+    duration: {
+        type: __PropType<Vector2 | undefined>;
+        required: false;
+    };
+    strength: {
+        type: __PropType<Vector2 | undefined>;
+        required: false;
+    };
+    mode: {
+        type: __PropType<GlitchMode | undefined>;
+        required: false;
+    };
+    active: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    ratio: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    columns: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    chromaticAberrationOffset: {
+        type: __PropType<Vector2 | undefined>;
+        required: false;
+    };
+    peturbationMap: {
+        type: __PropType<Texture | undefined>;
+        required: false;
+    };
+    dtSize: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+}>>, {}, {}>;
+export default _sfc_main;

package/dist/core/effects/Outline.d.ts

@@ -0,0 +1,134 @@
+import type { PropType } from 'vue';
+import type { BlendFunction, KernelSize } from 'postprocessing';
+import type { Object3D, ColorRepresentation } from 'three';
+export declare const Outline: import("vue").DefineComponent<{
+    /**
+     * The objects in the scene which should have an outline.
+     */
+    outlinedObjects: {
+        type: PropType<Object3D<import("three").Event>[]>;
+        requred: boolean;
+    };
+    /**
+     * The blend function. Use `BlendFunction.ALPHA` for dark outlines.
+     */
+    blendFunction: {
+        type: PropType<BlendFunction>;
+    };
+    patternTexture: {
+        type: PropType<number>;
+    };
+    patternScale: {
+        type: PropType<number>;
+    };
+    edgeStrength: {
+        type: PropType<number>;
+    };
+    /**
+     * The pulse speed. A value of zero disables the pulse effect.
+     */
+    pulseSpeed: {
+        type: PropType<number>;
+    };
+    visibleEdgeColor: {
+        type: PropType<[r: number, g: number, b: number] | ColorRepresentation>;
+    };
+    hiddenEdgeColor: {
+        type: PropType<[r: number, g: number, b: number] | ColorRepresentation>;
+    };
+    /**
+     * The number of samples used for multisample antialiasing. Requires WebGL 2.
+     */
+    multisampling: {
+        type: PropType<number>;
+    };
+    resolutionScale: {
+        type: PropType<number>;
+    };
+    resolutionX: {
+        type: PropType<number>;
+    };
+    resolutionY: {
+        type: PropType<number>;
+    };
+    /**
+     * The blur kernel size.
+     */
+    kernelSize: {
+        type: PropType<KernelSize>;
+    };
+    blur: {
+        type: PropType<boolean>;
+    };
+    /**
+     * Whether occluded parts of selected objects should be visible
+     */
+    xRay: {
+        type: PropType<boolean>;
+    };
+}, () => void, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * The objects in the scene which should have an outline.
+     */
+    outlinedObjects: {
+        type: PropType<Object3D<import("three").Event>[]>;
+        requred: boolean;
+    };
+    /**
+     * The blend function. Use `BlendFunction.ALPHA` for dark outlines.
+     */
+    blendFunction: {
+        type: PropType<BlendFunction>;
+    };
+    patternTexture: {
+        type: PropType<number>;
+    };
+    patternScale: {
+        type: PropType<number>;
+    };
+    edgeStrength: {
+        type: PropType<number>;
+    };
+    /**
+     * The pulse speed. A value of zero disables the pulse effect.
+     */
+    pulseSpeed: {
+        type: PropType<number>;
+    };
+    visibleEdgeColor: {
+        type: PropType<[r: number, g: number, b: number] | ColorRepresentation>;
+    };
+    hiddenEdgeColor: {
+        type: PropType<[r: number, g: number, b: number] | ColorRepresentation>;
+    };
+    /**
+     * The number of samples used for multisample antialiasing. Requires WebGL 2.
+     */
+    multisampling: {
+        type: PropType<number>;
+    };
+    resolutionScale: {
+        type: PropType<number>;
+    };
+    resolutionX: {
+        type: PropType<number>;
+    };
+    resolutionY: {
+        type: PropType<number>;
+    };
+    /**
+     * The blur kernel size.
+     */
+    kernelSize: {
+        type: PropType<KernelSize>;
+    };
+    blur: {
+        type: PropType<boolean>;
+    };
+    /**
+     * Whether occluded parts of selected objects should be visible
+     */
+    xRay: {
+        type: PropType<boolean>;
+    };
+}>>, {}, {}>;

package/dist/index.d.ts

@@ -1,4 +1,5 @@
-import { EffectComposer } from './core/useEffectComposer/component';
-import { Bloom } from './core/effects/Bloom';
-import { Glitch } from './core/effects/Glitch';
-export { EffectComposer, Bloom, Glitch };
+import EffectComposer from './core/EffectComposer.vue';
+import Bloom from './core/effects/Bloom.vue';
+import Glitch from './core/effects/Glitch.vue';
+import { Outline } from './core/effects/Outline';
+export { EffectComposer, Bloom, Glitch, Outline };