From 47a1cfd64ae33eeca0b0e19dcc7aa6628deac080 Mon Sep 17 00:00:00 2001
From: Maiko Tan <maiko.tan.coding@gmail.com>
Date: Tue, 2 Apr 2024 13:31:26 +0800
Subject: [PATCH] feat: add smaa effect

---
 src/core/effects/SMAA.vue | 49 +++++++++++++++++++++++++++++++++++++++
 src/index.ts              |  2 ++
 2 files changed, 51 insertions(+)
 create mode 100644 src/core/effects/SMAA.vue

diff --git a/src/core/effects/SMAA.vue b/src/core/effects/SMAA.vue
new file mode 100644
index 00000000..4561ed75
--- /dev/null
+++ b/src/core/effects/SMAA.vue
@@ -0,0 +1,49 @@
+<script setup lang="ts">
+import { BlendFunction, EdgeDetectionMode, PredicationMode, SMAAEffect, SMAAPreset } from 'postprocessing'
+import { useEffect } from '../composables/effect'
+// import { makePropWatchers } from '../../util/prop'
+
+export interface SMAAProps {
+  /**
+   * The blend function of this effect. This prop is not reactive.
+   * @default BlendFunction.SCREEN
+   * @type {BlendFunction}
+   * @memberof SMAAProps
+   */
+  blendFunction?: BlendFunction
+  /**
+   * The quality preset.
+   *
+   * @default SMAAPreset.MEDIUM
+   * @type {number}
+   * @memberof SMAAPreset
+   */
+  preset?: SMAAPreset
+  /**
+   * The edge detection mode.
+   *
+   * @default EdgeDetectionMode.COLOR
+   * @type {EdgeDetectionMode}
+   * @memberof SMAAProps
+   */
+  edgeDetectionMode?: EdgeDetectionMode
+  /**
+   * The predication mode.
+   *
+   * @default PredicationMode.NORMAL
+   * @type {PredicationMode}
+   * @memberof SMAAProps
+   */
+  predicationMode?: PredicationMode
+}
+
+const props = withDefaults(defineProps<SMAAProps>(), {})
+
+const { pass, effect } = useEffect(() => new SMAAEffect(props))
+
+defineExpose({ pass, effect }) // to allow users to modify pass and effect via template ref
+
+// makePropWatchers([], effect, () => new SMAAEffect())
+</script>
+
+<template></template>
diff --git a/src/index.ts b/src/index.ts
index c7e8ad25..563ead1b 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -4,6 +4,7 @@ import EffectComposer from './core/EffectComposer.vue'
 import Glitch from './core/effects/Glitch.vue'
 import Outline from './core/effects/Outline.vue'
 import Pixelation from './core/effects/Pixelation.vue'
+import SMAA from './core/effects/SMAA.vue'
 import Vignette from './core/effects/Vignette.vue'
 import Noise from './core/effects/Noise.vue'
 
@@ -17,6 +18,7 @@ export {
   Noise,
   Outline,
   Pixelation,
+  SMAA,
   Vignette,
   useEffect,
 }