{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "resume",
  "title": "Resume",
  "description": "Printable resume layout with experience, skills, and projects.",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "@atroui/utils"
  ],
  "files": [
    {
      "path": "registry/default/blocks/resume.tsx",
      "content": "import type { ReactNode } from \"react\"\nimport {\n  Briefcase,\n  Building2,\n  Code2,\n  GraduationCap,\n  Mail,\n  MapPin,\n  Phone,\n} from \"lucide-react\"\n\nimport { cn } from \"@/lib/utils\"\n\n/** Edit this blob after install — printable via `.resume-print`. */\nconst CONTENT = {\n  name: \"Your Name\",\n  title: \"Product engineer\",\n  summary:\n    \"Designer-engineer who ships calm interfaces and durable systems. Comfortable across product, frontend, and delivery.\",\n  email: \"hello@example.com\",\n  phone: \"+1 555 000 0000\",\n  location: \"Remote\",\n  experience: [\n    {\n      role: \"Founding Engineer\",\n      company: \"Example Studio\",\n      period: \"2024 — Present\",\n      description: [\n        \"Owned end-to-end product delivery for client MVPs.\",\n        \"Built reusable UI systems and host-bound tools.\",\n      ],\n    },\n    {\n      role: \"Frontend Engineer\",\n      company: \"Acme\",\n      period: \"2022 — 2024\",\n      description: [\n        \"Shipped design-system primitives used across web apps.\",\n        \"Improved Core Web Vitals and accessibility baselines.\",\n      ],\n    },\n  ],\n  education: [\n    {\n      degree: \"B.S. Computer Science\",\n      school: \"State University\",\n      year: \"2022\",\n    },\n  ],\n  skills: [\"TypeScript\", \"React\", \"Next.js\", \"Design systems\", \"Product\"],\n  projects: [\n    {\n      title: \"Personal site kit\",\n      description: \"Narrow chrome and indie home sections for AtroUI.\",\n      href: \"https://www.atroui.com\",\n    },\n    {\n      title: \"Studio tools\",\n      description: \"OG, scope, and thumbnail demos.\",\n      href: \"https://www.atroui.com/docs\",\n    },\n  ],\n}\n\nexport function Resume({\n  name = CONTENT.name,\n  title = CONTENT.title,\n  summary = CONTENT.summary,\n  email = CONTENT.email,\n  phone = CONTENT.phone,\n  location = CONTENT.location,\n  experience = CONTENT.experience,\n  education = CONTENT.education,\n  skills = CONTENT.skills,\n  projects = CONTENT.projects,\n  className,\n}: {\n  name?: string\n  title?: string\n  summary?: string\n  email?: string\n  phone?: string\n  location?: string\n  experience?: Array<{\n    role: string\n    company: string\n    period: string\n    description: string[]\n  }>\n  education?: Array<{ degree: string; school: string; year: string }>\n  skills?: string[]\n  projects?: Array<{ title: string; description: string; href?: string }>\n  className?: string\n} = {}) {\n  return (\n    <div\n      className={cn(\n        \"resume-print overflow-hidden rounded-[10px] border border-border-subtle bg-background\",\n        className\n      )}\n    >\n      <header className=\"border-b border-border-subtle bg-muted/40 p-6 sm:p-8\">\n        <div className=\"space-y-3\">\n          <div>\n            <h2 className=\"text-[1.75rem] font-medium tracking-[-0.02em] text-foreground sm:text-[2rem]\">\n              {name}\n            </h2>\n            <p className=\"mt-1 text-[15px] text-muted-foreground\">{title}</p>\n          </div>\n          <p className=\"max-w-[52ch] text-[14px] leading-[1.65] text-muted-foreground\">\n            {summary}\n          </p>\n          <div className=\"flex flex-wrap gap-2 pt-1\">\n            <MetaChip href={`mailto:${email}`} icon={Mail}>\n              {email}\n            </MetaChip>\n            {phone ? (\n              <MetaChip href={`tel:${phone.replace(/\\s+/g, \"\")}`} icon={Phone}>\n                {phone}\n              </MetaChip>\n            ) : null}\n            <MetaChip icon={MapPin}>{location}</MetaChip>\n          </div>\n        </div>\n      </header>\n\n      <div className=\"grid grid-cols-1 lg:grid-cols-3\">\n        <div className=\"p-6 sm:p-8 lg:col-span-2\">\n          <section aria-labelledby=\"resume-experience\">\n            <SectionLabel id=\"resume-experience\" icon={Briefcase}>\n              Experience\n            </SectionLabel>\n            <div className=\"space-y-8 pl-2\">\n              {experience.map((job) => (\n                <div\n                  key={`${job.role}-${job.company}-${job.period}`}\n                  className=\"relative pl-7\"\n                >\n                  <span\n                    aria-hidden\n                    className=\"absolute top-1.5 left-0 h-2.5 w-2.5 rounded-full border-2 border-background bg-foreground\"\n                  />\n                  <div className=\"flex flex-col gap-1 sm:flex-row sm:items-baseline sm:justify-between\">\n                    <h3 className=\"text-[15px] font-medium text-foreground\">\n                      {job.role}\n                    </h3>\n                    <span className=\"w-fit font-mono text-[11px] text-muted-foreground\">\n                      {job.period}\n                    </span>\n                  </div>\n                  <div className=\"mt-1 flex items-center gap-1.5 text-[13px] text-muted-foreground\">\n                    <Building2 className=\"h-3.5 w-3.5\" strokeWidth={1.75} />\n                    {job.company}\n                  </div>\n                  <ul className=\"mt-3 space-y-1.5 text-[13.5px] leading-[1.6] text-muted-foreground\">\n                    {job.description.map((line) => (\n                      <li key={line} className=\"flex gap-2.5\">\n                        <span\n                          aria-hidden\n                          className=\"mt-[8px] h-[3px] w-[3px] shrink-0 rounded-full bg-muted-foreground/50\"\n                        />\n                        <span>{line}</span>\n                      </li>\n                    ))}\n                  </ul>\n                </div>\n              ))}\n            </div>\n          </section>\n        </div>\n\n        <aside className=\"flex flex-col gap-8 border-t border-border-subtle bg-muted/30 p-6 sm:p-8 lg:border-t-0 lg:border-l\">\n          <section aria-labelledby=\"resume-education\">\n            <SectionLabel id=\"resume-education\" icon={GraduationCap}>\n              Education\n            </SectionLabel>\n            <div className=\"space-y-4\">\n              {education.map((ed) => (\n                <div\n                  key={`${ed.degree}-${ed.school}`}\n                  className=\"border-l border-border-subtle pl-3\"\n                >\n                  <h3 className=\"text-[14px] font-medium text-foreground\">\n                    {ed.degree}\n                  </h3>\n                  <p className=\"mt-0.5 text-[13px] text-muted-foreground\">\n                    {ed.school}\n                  </p>\n                  <p className=\"mt-1 font-mono text-[11px] text-muted-foreground\">\n                    {ed.year}\n                  </p>\n                </div>\n              ))}\n            </div>\n          </section>\n\n          <section aria-labelledby=\"resume-skills\">\n            <SectionLabel id=\"resume-skills\" icon={Code2}>\n              Skills\n            </SectionLabel>\n            <ul className=\"flex flex-wrap gap-1.5\">\n              {skills.map((skill) => (\n                <li\n                  key={skill}\n                  className=\"rounded-[4px] border border-border-subtle bg-background px-2 py-1 font-mono text-[11px] text-muted-foreground\"\n                >\n                  {skill}\n                </li>\n              ))}\n            </ul>\n          </section>\n        </aside>\n\n        {projects.length > 0 ? (\n          <div className=\"border-t border-border-subtle p-6 sm:p-8 lg:col-span-3\">\n            <section aria-labelledby=\"resume-projects\">\n              <SectionLabel id=\"resume-projects\" icon={Code2}>\n                Selected work\n              </SectionLabel>\n              <ul className=\"grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-3\">\n                {projects.map((project) => (\n                  <li\n                    key={project.title}\n                    className=\"rounded-[8px] border border-border-subtle p-3.5\"\n                  >\n                    {project.href ? (\n                      <a\n                        href={project.href}\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                        className=\"text-[13.5px] font-medium text-foreground hover:underline\"\n                      >\n                        {project.title}\n                      </a>\n                    ) : (\n                      <h3 className=\"text-[13.5px] font-medium text-foreground\">\n                        {project.title}\n                      </h3>\n                    )}\n                    <p className=\"mt-1.5 text-[12.5px] leading-[1.55] text-muted-foreground\">\n                      {project.description}\n                    </p>\n                  </li>\n                ))}\n              </ul>\n            </section>\n          </div>\n        ) : null}\n      </div>\n    </div>\n  )\n}\n\nfunction SectionLabel({\n  id,\n  icon: Icon,\n  children,\n}: {\n  id: string\n  icon: typeof Briefcase\n  children: ReactNode\n}) {\n  return (\n    <h3\n      id={id}\n      className=\"mb-4 flex items-center gap-2 font-mono text-[10.5px] tracking-[0.12em] text-muted-foreground uppercase\"\n    >\n      <Icon className=\"h-3.5 w-3.5\" strokeWidth={1.75} aria-hidden />\n      {children}\n    </h3>\n  )\n}\n\nfunction MetaChip({\n  href,\n  icon: Icon,\n  children,\n}: {\n  href?: string\n  icon: typeof Mail\n  children: ReactNode\n}) {\n  const className =\n    \"inline-flex items-center gap-1.5 rounded-lg border border-border-subtle bg-background px-2.5 py-1 font-mono text-[11px] text-muted-foreground\"\n  const inner = (\n    <>\n      <Icon className=\"h-3 w-3\" strokeWidth={1.75} aria-hidden />\n      {children}\n    </>\n  )\n  if (href) {\n    return (\n      <a href={href} className={cn(className, \"hover:text-foreground\")}>\n        {inner}\n      </a>\n    )\n  }\n  return <span className={className}>{inner}</span>\n}\n",
      "type": "registry:component",
      "target": "components/blocks/resume.tsx"
    }
  ],
  "type": "registry:block"
}