React Component
import React, { useState } from 'react';
import { motion } from 'framer-motion';
const AppHeader = ({ title, onMenuClick }) => {
const [isAnimating, setIsAnimating] = useState(false);
return (
<header className="app-header">
<motion.div
initial={{ opacity: 0, y: -20 }}
animate={{ opacity: 1, y: 0 }}
className="header-container"
>
<h1>{title}</h1>
<nav className="header-nav">
<button onClick={onMenuClick}>
Menu
</button>
</nav>
</motion.div>
</header>
);
};
export default AppHeader;
Code Information
• Generated using AppCraft AI Studio
• Framework: React with Framer Motion
• Component Type: Functional Component
• Dependencies: react, framer-motion