feat(date): Date preview

src/features/date/options/DatePreview.jsx

@@ -0,0 +1,30 @@
+import React from 'react';
+import { motion, AnimatePresence } from 'framer-motion';
+import DateWidget from 'features/date/Date';
+
+const DatePreview = ({ zoomLevel = 100 }) => {
+  const dateType = localStorage.getItem('dateType') || 'long';
+
+  return (
+    <AnimatePresence mode="crossfade">
+      <motion.div
+        className="absolute"
+        key={`date-preview-${dateType}`}
+        initial={{ opacity: 0, scale: 0.95 }}
+        animate={{
+          opacity: 1,
+          scale: zoomLevel / 100,
+        }}
+        exit={{ opacity: 0, scale: 0.95 }}
+        transition={{
+          opacity: { duration: 0.2 },
+          scale: { duration: 0.3, ease: 'anticipate' },
+        }}
+      >
+        <DateWidget isPreview={true} staticDate={new Date(2024, 2, 15)} />
+      </motion.div>
+    </AnimatePresence>
+  );
+};
+
+export { DatePreview, DatePreview as default };