From 3ae150f448005a75b1c7c8aa96eb747357647aaa Mon Sep 17 00:00:00 2001
From: Walidoux <ma.walidkorchi@icloud.com>
Date: Sun, 23 Apr 2023 20:13:44 +0100
Subject: [PATCH] feat(components/system): implement AnimatedView

---
 .../system/AnimateView/AnimateView.tsx        | 19 +++++++++++++++++++
 src/components/system/AnimateView/index.ts    |  1 +
 2 files changed, 20 insertions(+)
 create mode 100644 src/components/system/AnimateView/AnimateView.tsx
 create mode 100644 src/components/system/AnimateView/index.ts

diff --git a/src/components/system/AnimateView/AnimateView.tsx b/src/components/system/AnimateView/AnimateView.tsx
new file mode 100644
index 0000000..8dd60be
--- /dev/null
+++ b/src/components/system/AnimateView/AnimateView.tsx
@@ -0,0 +1,19 @@
+import type { HTMLMotionProps } from 'framer-motion'
+import { AnimatePresence, motion } from 'framer-motion'
+
+export interface AnimateViewProps extends HTMLMotionProps<'main'> {
+  condition: boolean
+  children: React.ReactNode
+}
+
+export const AnimateView: React.FC<AnimateViewProps> = ({ condition, children, ...rest }) => {
+  return (
+    <AnimatePresence>
+      {condition && (
+        <motion.main initial={rest.initial} animate={rest.animate} exit={rest.exit} {...rest}>
+          {children}
+        </motion.main>
+      )}
+    </AnimatePresence>
+  )
+}
diff --git a/src/components/system/AnimateView/index.ts b/src/components/system/AnimateView/index.ts
new file mode 100644
index 0000000..5e1c5cb
--- /dev/null
+++ b/src/components/system/AnimateView/index.ts
@@ -0,0 +1 @@
+export * from './AnimateView'