{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "professional-resume-baseui",
  "type": "registry:component",
  "title": "Professional Resume",
  "description": "Clean, formal resume template suitable for corporate applications (Base UI)",
  "registryDependencies": [
    "button"
  ],
  "dependencies": [
    "framer-motion",
    "react"
  ],
  "files": [
    {
      "path": "@uitripled/react-baseui/src/components/resumes/baseui/professional-resume-baseui.tsx",
      "content": "\"use client\";\n\nimport { NativeButton as Button } from \"../../native/baseui/native-button-baseui\";\nimport { motion, Variants } from \"framer-motion\";\nimport { Download, Globe, Linkedin, Mail, MapPin, Phone } from \"lucide-react\";\n\nconst RESUME_DATA = {\n  personalInfo: {\n    name: \"Alex Morgan\",\n    title: \"Senior Software Engineer\",\n    summary:\n      \"Results-oriented Senior Software Engineer with over 8 years of experience in designing, developing, and deploying scalable web applications. Proven track record of leadership, mentoring junior developers, and driving technical innovation. Expert in full-stack development with a focus on React, Node.js, and cloud architecture.\",\n    email: \"alex.morgan@example.com\",\n    phone: \"(555) 123-4567\",\n    location: \"New York, NY\",\n    linkedin: \"linkedin.com/in/alexmorgan\",\n    website: \"alexmorgan.dev\",\n  },\n  experience: [\n    {\n      company: \"TechCorp Solutions\",\n      role: \"Senior Software Engineer\",\n      period: \"2020 - Present\",\n      description: [\n        \"Architected and led the development of a microservices-based e-commerce platform, handling over 100k daily active users.\",\n        \"Reduced server costs by 40% through optimization of AWS infrastructure and implementation of serverless functions.\",\n        \"Mentored a team of 5 junior developers, conducting code reviews and facilitating technical workshops.\",\n      ],\n    },\n    {\n      company: \"Innovate Inc.\",\n      role: \"Software Engineer\",\n      period: \"2017 - 2020\",\n      description: [\n        \"Developed key features for the company's flagship SaaS product using React and Redux.\",\n        \"Implemented a real-time notification system using WebSockets, improving user engagement by 25%.\",\n        \"Collaborated with product managers and designers to define requirements and deliver high-quality user experiences.\",\n      ],\n    },\n  ],\n  skills: {\n    languages:\n      \"JavaScript (ES6+), TypeScript, Python, React, Next.js, Node.js, Express, Django\",\n    tools:\n      \"AWS (EC2, Lambda, S3), Docker, Kubernetes, Git, CI/CD (GitHub Actions), PostgreSQL, MongoDB\",\n  },\n  education: {\n    school: \"University of Technology\",\n    degree: \"Bachelor of Science in Computer Science\",\n    period: \"2013 - 2017\",\n  },\n  certifications: [\n    \"AWS Certified Solutions Architect – Associate\",\n    \"Meta Front-End Developer Professional Certificate\",\n  ],\n};\n\nfunction Separator({ className }: { className?: string }) {\n  return (\n    <div className={`w-full h-[1px] bg-border ${className}`} role=\"separator\" />\n  );\n}\n\nexport function ProfessionalResumeBaseUI() {\n  const fadeIn: Variants = {\n    hidden: { opacity: 0, y: 10 },\n    show: { opacity: 1, y: 0, transition: { duration: 0.5, ease: \"easeOut\" } },\n  };\n\n  const staggerContainer: Variants = {\n    hidden: { opacity: 0 },\n    show: {\n      opacity: 1,\n      transition: {\n        staggerChildren: 0.1,\n      },\n    },\n  };\n\n  return (\n    <div className=\"\">\n      <motion.div\n        variants={staggerContainer}\n        initial=\"hidden\"\n        animate=\"show\"\n        className=\"p-8 md:p-12 space-y-8\"\n      >\n        {/* Header */}\n        <motion.div variants={fadeIn} className=\"text-center space-y-4\">\n          <h1 className=\"text-4xl md:text-5xl font-bold text-foreground tracking-tight\">\n            {RESUME_DATA.personalInfo.name}\n          </h1>\n          <p className=\"text-lg text-muted-foreground font-sans uppercase tracking-widest text-sm\">\n            {RESUME_DATA.personalInfo.title}\n          </p>\n\n          <div className=\"flex flex-wrap justify-center gap-4 text-sm text-muted-foreground font-sans pt-2\">\n            <div className=\"flex items-center gap-1.5\">\n              <Mail className=\"h-4 w-4\" />\n              <span>{RESUME_DATA.personalInfo.email}</span>\n            </div>\n            <div className=\"flex items-center gap-1.5\">\n              <Phone className=\"h-4 w-4\" />\n              <span>{RESUME_DATA.personalInfo.phone}</span>\n            </div>\n            <div className=\"flex items-center gap-1.5\">\n              <MapPin className=\"h-4 w-4\" />\n              <span>{RESUME_DATA.personalInfo.location}</span>\n            </div>\n            <div className=\"flex items-center gap-1.5\">\n              <Linkedin className=\"h-4 w-4\" />\n              <span>{RESUME_DATA.personalInfo.linkedin}</span>\n            </div>\n            <div className=\"flex items-center gap-1.5\">\n              <Globe className=\"h-4 w-4\" />\n              <span>{RESUME_DATA.personalInfo.website}</span>\n            </div>\n          </div>\n        </motion.div>\n\n        <Separator />\n\n        {/* Summary */}\n        <motion.div variants={fadeIn} className=\"space-y-3\">\n          <h2 className=\"text-xl font-bold text-foreground border-b-2 border-foreground pb-1 inline-block\">\n            Professional Summary\n          </h2>\n          <p className=\"text-card-foreground leading-relaxed font-sans text-sm md:text-base\">\n            {RESUME_DATA.personalInfo.summary}\n          </p>\n        </motion.div>\n\n        {/* Experience */}\n        <motion.div variants={fadeIn} className=\"space-y-6\">\n          <h2 className=\"text-xl font-bold text-foreground border-b-2 border-foreground pb-1 inline-block\">\n            Experience\n          </h2>\n\n          <div className=\"space-y-6\">\n            {RESUME_DATA.experience.map((job, index) => (\n              <div key={index}>\n                <div className=\"flex justify-between items-baseline mb-1\">\n                  <h3 className=\"text-lg font-bold text-foreground\">\n                    {job.company}\n                  </h3>\n                  <span className=\"text-sm font-sans text-muted-foreground\">\n                    {job.period}\n                  </span>\n                </div>\n                <p className=\"text-card-foreground font-medium italic mb-2\">\n                  {job.role}\n                </p>\n                <ul className=\"list-disc list-outside ml-5 space-y-1 text-card-foreground font-sans text-sm\">\n                  {job.description.map((item, i) => (\n                    <li key={i}>{item}</li>\n                  ))}\n                </ul>\n              </div>\n            ))}\n          </div>\n        </motion.div>\n\n        {/* Skills */}\n        <motion.div variants={fadeIn} className=\"space-y-3\">\n          <h2 className=\"text-xl font-bold text-foreground border-b-2 border-foreground pb-1 inline-block\">\n            Technical Skills\n          </h2>\n          <div className=\"grid grid-cols-1 md:grid-cols-2 gap-4 font-sans text-sm\">\n            <div>\n              <span className=\"font-bold text-foreground block mb-1\">\n                Languages & Frameworks:\n              </span>\n              <p className=\"text-card-foreground\">\n                {RESUME_DATA.skills.languages}\n              </p>\n            </div>\n            <div>\n              <span className=\"font-bold text-foreground block mb-1\">\n                Tools & Platforms:\n              </span>\n              <p className=\"text-card-foreground\">{RESUME_DATA.skills.tools}</p>\n            </div>\n          </div>\n        </motion.div>\n\n        {/* Education */}\n        <motion.div variants={fadeIn} className=\"space-y-3\">\n          <h2 className=\"text-xl font-bold text-foreground border-b-2 border-foreground pb-1 inline-block\">\n            Education\n          </h2>\n          <div>\n            <div className=\"flex justify-between items-baseline\">\n              <h3 className=\"text-lg font-bold text-foreground\">\n                {RESUME_DATA.education.school}\n              </h3>\n              <span className=\"text-sm font-sans text-muted-foreground\">\n                {RESUME_DATA.education.period}\n              </span>\n            </div>\n            <p className=\"text-card-foreground font-sans\">\n              {RESUME_DATA.education.degree}\n            </p>\n          </div>\n        </motion.div>\n\n        {/* Certifications */}\n        <motion.div variants={fadeIn} className=\"space-y-3\">\n          <h2 className=\"text-xl font-bold text-foreground border-b-2 border-foreground pb-1 inline-block\">\n            Certifications\n          </h2>\n          <ul className=\"list-disc list-outside ml-5 space-y-1 text-card-foreground font-sans text-sm\">\n            {RESUME_DATA.certifications.map((cert, index) => (\n              <li key={index}>{cert}</li>\n            ))}\n          </ul>\n        </motion.div>\n\n        <div className=\"pt-8 flex justify-center\">\n          <Button className=\"gap-2\">\n            <Download className=\"h-4 w-4\" />\n            Download PDF\n          </Button>\n        </div>\n      </motion.div>\n    </div>\n  );\n}\n",
      "type": "registry:component",
      "target": "components/uitripled/professional-resume-baseui.tsx"
    }
  ]
}