{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"marketing-careers-department-positions","type":"registry:block","title":"Department Positions","files":[{"path":"components/blocks/marketing/careers/department-positions.tsx","content":"import * as React from 'react';\n\nimport { Badge } from '@/components/ui/badge';\nimport { Button } from '@/components/ui/button';\nimport { Card, CardContent } from '@/components/ui/card';\nimport {\n  Accordion,\n  AccordionContent,\n  AccordionItem,\n  AccordionTrigger,\n} from '@/components/ui/accordion';\nimport {\n  BriefcaseIcon,\n  MapPinIcon,\n  UsersIcon,\n  ArrowRightIcon,\n  ChevronRightIcon,\n  BuildingIcon,\n} from 'lucide-react';\n\ntype JobPositionId = string;\n\ninterface JobPosition {\n  id: JobPositionId;\n  title: string;\n  location: string;\n  locationType: 'remote' | 'onsite' | 'hybrid';\n  employmentType: 'full-time' | 'part-time' | 'contract' | 'internship';\n  salary: string;\n  description: string;\n  featured: boolean;\n}\n\ninterface Department {\n  id: string;\n  name: string;\n  description: string;\n  icon: React.ReactNode;\n  teamSize: number;\n  positions: JobPosition[];\n}\n\nexport default function DepartmentPositions() {\n  const departments: Department[] = [\n    {\n      id: 'engineering',\n      name: 'Engineering',\n      description:\n        'Build innovative solutions that scale to millions of users worldwide.',\n      icon: <BuildingIcon className=\"h-6 w-6\" />,\n      teamSize: 48,\n      positions: [\n        {\n          id: 'senior-frontend-engineer',\n          title: 'Senior Frontend Engineer',\n          location: 'San Francisco, CA',\n          locationType: 'hybrid',\n          employmentType: 'full-time',\n          salary: '$130,000 - $160,000',\n          description:\n            \"We're looking for a Senior Frontend Engineer to join our team and help build the next generation of our web applications. You'll work with React, TypeScript, and GraphQL to create fast, responsive, and user-friendly interfaces.\",\n          featured: true,\n        },\n        {\n          id: 'backend-engineer',\n          title: 'Backend Engineer',\n          location: 'Remote',\n          locationType: 'remote',\n          employmentType: 'full-time',\n          salary: '$120,000 - $150,000',\n          description:\n            \"Join our backend team to design and implement scalable APIs and services. You'll work with Node.js, Express, and PostgreSQL to build the foundation of our products.\",\n          featured: false,\n        },\n        {\n          id: 'devops-engineer',\n          title: 'DevOps Engineer',\n          location: 'Seattle, WA',\n          locationType: 'hybrid',\n          employmentType: 'full-time',\n          salary: '$125,000 - $155,000',\n          description:\n            \"Help us build and maintain our cloud infrastructure, CI/CD pipelines, and developer tools. You'll work with Kubernetes, AWS, and Terraform to ensure our systems are reliable and efficient.\",\n          featured: false,\n        },\n        {\n          id: 'data-engineer',\n          title: 'Data Engineer',\n          location: 'Remote',\n          locationType: 'remote',\n          employmentType: 'full-time',\n          salary: '$120,000 - $150,000',\n          description:\n            \"Join our data team to build data pipelines and infrastructure. You'll work with BigQuery, Airflow, and Python to ensure data is available, reliable, and actionable.\",\n          featured: false,\n        },\n      ],\n    },\n    {\n      id: 'product',\n      name: 'Product',\n      description:\n        'Define the product roadmap and bring innovative ideas to life.',\n      icon: <BriefcaseIcon className=\"h-6 w-6\" />,\n      teamSize: 15,\n      positions: [\n        {\n          id: 'product-manager',\n          title: 'Product Manager',\n          location: 'New York, NY',\n          locationType: 'hybrid',\n          employmentType: 'full-time',\n          salary: '$120,000 - $150,000',\n          description:\n            \"We're looking for a Product Manager to help define our product roadmap and work with engineering and design to bring new features to market. You'll be responsible for understanding user needs, defining requirements, and measuring success.\",\n          featured: true,\n        },\n        {\n          id: 'product-designer',\n          title: 'Product Designer',\n          location: 'San Francisco, CA',\n          locationType: 'onsite',\n          employmentType: 'full-time',\n          salary: '$110,000 - $140,000',\n          description:\n            \"Join our design team to create beautiful, intuitive interfaces for our products. You'll work closely with product and engineering to ensure our products are easy to use and visually appealing.\",\n          featured: false,\n        },\n      ],\n    },\n    {\n      id: 'marketing',\n      name: 'Marketing',\n      description:\n        'Share our story with the world and drive customer acquisition.',\n      icon: <UsersIcon className=\"h-6 w-6\" />,\n      teamSize: 12,\n      positions: [\n        {\n          id: 'growth-marketing-manager',\n          title: 'Growth Marketing Manager',\n          location: 'Boston, MA',\n          locationType: 'hybrid',\n          employmentType: 'full-time',\n          salary: '$95,000 - $120,000',\n          description:\n            \"We're looking for a Growth Marketing Manager to drive customer acquisition and retention. You'll be responsible for designing and executing marketing campaigns across various channels, including paid advertising, email, and social media.\",\n          featured: false,\n        },\n        {\n          id: 'content-marketing-specialist',\n          title: 'Content Marketing Specialist',\n          location: 'Remote',\n          locationType: 'remote',\n          employmentType: 'full-time',\n          salary: '$80,000 - $100,000',\n          description:\n            \"Join our marketing team to create compelling content that educates and inspires our audience. You'll be responsible for blog posts, case studies, whitepapers, and other content that drives engagement and conversions.\",\n          featured: false,\n        },\n      ],\n    },\n    {\n      id: 'sales',\n      name: 'Sales',\n      description:\n        'Connect with customers and help them succeed with our products.',\n      icon: <MapPinIcon className=\"h-6 w-6\" />,\n      teamSize: 20,\n      positions: [\n        {\n          id: 'account-executive',\n          title: 'Account Executive',\n          location: 'Chicago, IL',\n          locationType: 'hybrid',\n          employmentType: 'full-time',\n          salary: '$80,000 - $100,000 + Commission',\n          description:\n            \"We're looking for an Account Executive to join our sales team and help drive revenue growth. You'll be responsible for prospecting, qualifying, and closing deals with new customers.\",\n          featured: true,\n        },\n        {\n          id: 'sales-development-representative',\n          title: 'Sales Development Representative',\n          location: 'New York, NY',\n          locationType: 'onsite',\n          employmentType: 'full-time',\n          salary: '$60,000 - $75,000 + Commission',\n          description:\n            \"Join our sales team to identify and qualify new sales opportunities. You'll be the first point of contact for potential customers and will work closely with Account Executives to move deals forward.\",\n          featured: false,\n        },\n        {\n          id: 'customer-success-manager',\n          title: 'Customer Success Manager',\n          location: 'Remote',\n          locationType: 'remote',\n          employmentType: 'full-time',\n          salary: '$85,000 - $110,000',\n          description:\n            \"Help our customers get the most value from our products. You'll be responsible for onboarding, training, and ongoing support to ensure customer satisfaction and retention.\",\n          featured: false,\n        },\n      ],\n    },\n    {\n      id: 'hr',\n      name: 'Human Resources',\n      description: 'Build and nurture our company culture and talent.',\n      icon: <UsersIcon className=\"h-6 w-6\" />,\n      teamSize: 8,\n      positions: [\n        {\n          id: 'talent-acquisition-specialist',\n          title: 'Talent Acquisition Specialist',\n          location: 'San Francisco, CA',\n          locationType: 'hybrid',\n          employmentType: 'full-time',\n          salary: '$85,000 - $105,000',\n          description:\n            \"We're looking for a Talent Acquisition Specialist to help us find and hire the best talent. You'll be responsible for sourcing, screening, and interviewing candidates for roles across the company.\",\n          featured: false,\n        },\n        {\n          id: 'people-operations-coordinator',\n          title: 'People Operations Coordinator',\n          location: 'Remote',\n          locationType: 'remote',\n          employmentType: 'part-time',\n          salary: '$50,000 - $65,000',\n          description:\n            'Support our HR team with day-to-day operations, including onboarding, benefits administration, and employee engagement initiatives.',\n          featured: false,\n        },\n      ],\n    },\n  ];\n\n  const totalOpenPositions = departments.reduce(\n    (sum, dept) => sum + dept.positions.length,\n    0\n  );\n\n  return (\n    <div className=\"container mx-auto px-4 py-12\">\n      <div className=\"mb-12 text-center\">\n        <h2 className=\"mb-3 text-3xl font-bold tracking-tight\">\n          Join Our Team\n        </h2>\n        <p className=\"text-muted-foreground mx-auto max-w-2xl\">\n          We&apos;re on a mission to build products that make a difference.\n          Explore our open positions and find your next opportunity.\n        </p>\n        <div className=\"mt-6\">\n          <Badge className=\"bg-primary px-3 py-1.5 text-sm text-white\">\n            {totalOpenPositions} Open Positions\n          </Badge>\n        </div>\n      </div>\n\n      <Accordion type=\"single\" collapsible className=\"w-full space-y-6\">\n        {departments.map((department) => (\n          <AccordionItem\n            key={department.id}\n            value={department.id}\n            className=\"border-muted overflow-hidden rounded-lg border\"\n          >\n            <AccordionTrigger className=\"data-[state=open]:bg-muted/30 px-6 py-4 hover:no-underline\">\n              <div className=\"flex w-full items-center gap-4 text-left\">\n                <div className=\"bg-primary/10 text-primary flex-shrink-0 rounded-lg p-2\">\n                  {department.icon}\n                </div>\n                <div className=\"flex-grow\">\n                  <h3 className=\"text-xl font-semibold\">{department.name}</h3>\n                  <p className=\"text-muted-foreground mt-1 text-sm\">\n                    {department.description}\n                  </p>\n                </div>\n                <div className=\"hidden flex-shrink-0 items-center gap-3 md:flex\">\n                  <div className=\"text-muted-foreground flex items-center gap-1.5 text-sm\">\n                    <UsersIcon className=\"h-4 w-4\" />\n                    <span>{department.teamSize} Team Members</span>\n                  </div>\n                  <Badge variant=\"outline\" className=\"ml-4\">\n                    {department.positions.length}{' '}\n                    {department.positions.length === 1\n                      ? 'Position'\n                      : 'Positions'}\n                  </Badge>\n                </div>\n              </div>\n            </AccordionTrigger>\n            <AccordionContent className=\"pb-0\">\n              <div className=\"grid gap-4 p-6 pt-2\">\n                {department.positions.map((position) => (\n                  <Card\n                    key={position.id}\n                    className={\n                      position.featured ? 'border-primary/50 bg-primary/5' : ''\n                    }\n                  >\n                    <CardContent className=\"p-5\">\n                      <div className=\"mb-4 flex flex-col justify-between gap-4 sm:flex-row sm:items-center\">\n                        <div>\n                          <div className=\"mb-1.5 flex items-center gap-2\">\n                            <h3 className=\"text-lg font-semibold\">\n                              {position.title}\n                            </h3>\n                            {position.featured && (\n                              <Badge className=\"bg-primary text-white\">\n                                Featured\n                              </Badge>\n                            )}\n                          </div>\n                          <div className=\"text-muted-foreground flex flex-wrap gap-x-4 gap-y-2 text-sm\">\n                            <div className=\"flex items-center gap-1\">\n                              <MapPinIcon className=\"h-4 w-4\" />\n                              <span>{position.location}</span>\n                            </div>\n                            <div className=\"flex items-center gap-1\">\n                              <Badge variant=\"outline\" className=\"bg-muted\">\n                                {position.locationType === 'remote'\n                                  ? 'Remote'\n                                  : position.locationType === 'hybrid'\n                                    ? 'Hybrid'\n                                    : 'On-site'}\n                              </Badge>\n                            </div>\n                            <div className=\"flex items-center gap-1\">\n                              <Badge variant=\"outline\" className=\"bg-muted\">\n                                {position.employmentType === 'full-time'\n                                  ? 'Full-time'\n                                  : position.employmentType === 'part-time'\n                                    ? 'Part-time'\n                                    : position.employmentType === 'contract'\n                                      ? 'Contract'\n                                      : 'Internship'}\n                              </Badge>\n                            </div>\n                          </div>\n                        </div>\n                        <div className=\"flex items-center gap-3\">\n                          <Badge\n                            variant=\"outline\"\n                            className=\"whitespace-nowrap\"\n                          >\n                            {position.salary}\n                          </Badge>\n                          <Button size=\"sm\" className=\"whitespace-nowrap\">\n                            Apply <ChevronRightIcon className=\"ml-1 h-4 w-4\" />\n                          </Button>\n                        </div>\n                      </div>\n                      <p className=\"text-muted-foreground\">\n                        {position.description}\n                      </p>\n                    </CardContent>\n                  </Card>\n                ))}\n              </div>\n              <div className=\"bg-muted/30 flex items-center justify-between p-4\">\n                <p className=\"text-muted-foreground text-sm\">\n                  Interested in {department.name.toLowerCase()} but don&apos;t\n                  see the right role?\n                </p>\n                <a\n                  href={`/careers/${department.id}`}\n                  className=\"text-primary flex items-center gap-1 text-sm font-medium hover:underline\"\n                >\n                  View Department\n                  <ArrowRightIcon className=\"h-3.5 w-3.5\" />\n                </a>\n              </div>\n            </AccordionContent>\n          </AccordionItem>\n        ))}\n      </Accordion>\n\n      <div className=\"bg-muted/30 mt-16 rounded-lg p-8 text-center\">\n        <h3 className=\"mb-3 text-xl font-semibold\">\n          Don&apos;t see the perfect role?\n        </h3>\n        <p className=\"text-muted-foreground mx-auto mb-6 max-w-xl\">\n          We&apos;re always looking for talented individuals who are passionate\n          about our mission. Send us your resume and we&apos;ll keep you in mind\n          for future opportunities.\n        </p>\n        <div className=\"flex flex-col justify-center gap-4 sm:flex-row\">\n          <Button variant=\"outline\">Join Our Talent Community</Button>\n          <Button>\n            Send Your Resume\n            <ArrowRightIcon className=\"ml-2 h-4 w-4\" />\n          </Button>\n        </div>\n      </div>\n    </div>\n  );\n}\n","type":"registry:component","target":"components/blocks/marketing/careers/department-positions.tsx"},{"path":"components/ui/badge.tsx","content":"import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { Slot } from \"radix-ui\"\n\nimport { cn } from \"@/lib/utils\"\n\nconst badgeVariants = cva(\n  \"group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3!\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground [a]:hover:bg-primary/80\",\n        secondary:\n          \"bg-secondary text-secondary-foreground [a]:hover:bg-secondary/80\",\n        destructive:\n          \"bg-destructive/10 text-destructive focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:focus-visible:ring-destructive/40 [a]:hover:bg-destructive/20\",\n        outline:\n          \"border-border text-foreground [a]:hover:bg-muted [a]:hover:text-muted-foreground\",\n        ghost:\n          \"hover:bg-muted hover:text-muted-foreground dark:hover:bg-muted/50\",\n        link: \"text-primary underline-offset-4 hover:underline\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n)\n\nfunction Badge({\n  className,\n  variant = \"default\",\n  asChild = false,\n  ...props\n}: React.ComponentProps<\"span\"> &\n  VariantProps<typeof badgeVariants> & { asChild?: boolean }) {\n  const Comp = asChild ? Slot.Root : \"span\"\n\n  return (\n    <Comp\n      data-slot=\"badge\"\n      data-variant={variant}\n      className={cn(badgeVariants({ variant }), className)}\n      {...props}\n    />\n  )\n}\n\nexport { Badge, badgeVariants }\n","type":"registry:ui","target":"components/ui/badge.tsx"},{"path":"components/ui/button.tsx","content":"import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { Slot } from \"radix-ui\"\n\nimport { cn } from \"@/lib/utils\"\n\nconst buttonVariants = cva(\n  \"group/button inline-flex shrink-0 items-center justify-center rounded-md border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground hover:bg-primary/80\",\n        outline:\n          \"border-border bg-background shadow-xs hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50\",\n        secondary:\n          \"bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground\",\n        ghost:\n          \"hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50\",\n        destructive:\n          \"bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40\",\n        link: \"text-primary underline-offset-4 hover:underline\",\n      },\n      size: {\n        default:\n          \"h-9 gap-1.5 px-2.5 in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2\",\n        xs: \"h-6 gap-1 rounded-[min(var(--radius-md),8px)] px-2 text-xs in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3\",\n        sm: \"h-8 gap-1 rounded-[min(var(--radius-md),10px)] px-2.5 in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5\",\n        lg: \"h-10 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2\",\n        icon: \"size-9\",\n        \"icon-xs\":\n          \"size-6 rounded-[min(var(--radius-md),8px)] in-data-[slot=button-group]:rounded-md [&_svg:not([class*='size-'])]:size-3\",\n        \"icon-sm\":\n          \"size-8 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-md\",\n        \"icon-lg\": \"size-10\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n)\n\nfunction Button({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  asChild = false,\n  ...props\n}: React.ComponentProps<\"button\"> &\n  VariantProps<typeof buttonVariants> & {\n    asChild?: boolean\n  }) {\n  const Comp = asChild ? Slot.Root : \"button\"\n\n  return (\n    <Comp\n      data-slot=\"button\"\n      data-variant={variant}\n      data-size={size}\n      className={cn(buttonVariants({ variant, size, className }))}\n      {...props}\n    />\n  )\n}\n\nexport { Button, buttonVariants }\n","type":"registry:ui","target":"components/ui/button.tsx"},{"path":"components/ui/card.tsx","content":"import * as React from \"react\"\n\nimport { cn } from \"@/lib/utils\"\n\nfunction Card({\n  className,\n  size = \"default\",\n  ...props\n}: React.ComponentProps<\"div\"> & { size?: \"default\" | \"sm\" }) {\n  return (\n    <div\n      data-slot=\"card\"\n      data-size={size}\n      className={cn(\n        \"group/card flex flex-col gap-6 overflow-hidden rounded-xl bg-card py-6 text-sm text-card-foreground shadow-xs ring-1 ring-foreground/10 has-[>img:first-child]:pt-0 data-[size=sm]:gap-4 data-[size=sm]:py-4 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CardHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-header\"\n      className={cn(\n        \"group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-6 group-data-[size=sm]/card:px-4 has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-6 group-data-[size=sm]/card:[.border-b]:pb-4\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CardTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-title\"\n      className={cn(\n        \"font-heading text-base leading-normal font-medium group-data-[size=sm]/card:text-sm\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CardDescription({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-description\"\n      className={cn(\"text-sm text-muted-foreground\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction CardAction({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-action\"\n      className={cn(\n        \"col-start-2 row-span-2 row-start-1 self-start justify-self-end\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CardContent({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-content\"\n      className={cn(\"px-6 group-data-[size=sm]/card:px-4\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction CardFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-footer\"\n      className={cn(\n        \"flex items-center rounded-b-xl px-6 group-data-[size=sm]/card:px-4 [.border-t]:pt-6 group-data-[size=sm]/card:[.border-t]:pt-4\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Card,\n  CardHeader,\n  CardFooter,\n  CardTitle,\n  CardAction,\n  CardDescription,\n  CardContent,\n}\n","type":"registry:ui","target":"components/ui/card.tsx"},{"path":"components/ui/accordion.tsx","content":"\"use client\"\n\nimport * as React from \"react\"\nimport { Accordion as AccordionPrimitive } from \"radix-ui\"\n\nimport { cn } from \"@/lib/utils\"\nimport { ChevronDownIcon, ChevronUpIcon } from \"lucide-react\"\n\nfunction Accordion({\n  className,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Root>) {\n  return (\n    <AccordionPrimitive.Root\n      data-slot=\"accordion\"\n      className={cn(\"flex w-full flex-col\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction AccordionItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Item>) {\n  return (\n    <AccordionPrimitive.Item\n      data-slot=\"accordion-item\"\n      className={cn(\"not-last:border-b\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction AccordionTrigger({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Trigger>) {\n  return (\n    <AccordionPrimitive.Header className=\"flex\">\n      <AccordionPrimitive.Trigger\n        data-slot=\"accordion-trigger\"\n        className={cn(\n          \"group/accordion-trigger relative flex flex-1 items-start justify-between rounded-md border border-transparent py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:after:border-ring disabled:pointer-events-none disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground\",\n          className\n        )}\n        {...props}\n      >\n        {children}\n        <ChevronDownIcon data-slot=\"accordion-trigger-icon\" className=\"pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden\" />\n        <ChevronUpIcon data-slot=\"accordion-trigger-icon\" className=\"pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline\" />\n      </AccordionPrimitive.Trigger>\n    </AccordionPrimitive.Header>\n  )\n}\n\nfunction AccordionContent({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Content>) {\n  return (\n    <AccordionPrimitive.Content\n      data-slot=\"accordion-content\"\n      className=\"overflow-hidden text-sm data-open:animate-accordion-down data-closed:animate-accordion-up\"\n      {...props}\n    >\n      <div\n        className={cn(\n          \"pt-0 pb-4 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4\",\n          className\n        )}\n      >\n        {children}\n      </div>\n    </AccordionPrimitive.Content>\n  )\n}\n\nexport { Accordion, AccordionItem, AccordionTrigger, AccordionContent }\n","type":"registry:ui","target":"components/ui/accordion.tsx"}],"description":"A list of open positions grouped by department, each with a title and location. Helps candidates find the right team and apply to the matching role.","dependencies":["class-variance-authority","lucide-react","radix-ui"]}