{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "section",
  "title": "Section",
  "description": "Section from the Get IT Done design system.",
  "dependencies": [],
  "registryDependencies": [
    "https://zero-design.itdone.de/r/utils.json",
    "https://zero-design.itdone.de/r/theme.json"
  ],
  "files": [
    {
      "path": "registry/ui/section/section.interface.ts",
      "content": "export interface SectionProps {\n  variant?: 'white' | 'light' | 'accent' | 'primary';\n  bgImgPath?: string;\n  children?: JSX.Element;\n  fullWidth?: boolean;\n  maxWidth?: number;\n  // Classes of the inner content frame (cap, centering). Merged with tailwind-merge, so `max-w-content` replaces the default 1170px cap.\n  contentClassName?: string;\n  className?: string;\n  Comp?: keyof JSX.IntrinsicElements;\n}\n",
      "type": "registry:ui"
    },
    {
      "path": "registry/ui/section/section.tsx",
      "content": "import { cn } from '@/lib/utils';\nimport { SectionProps } from './section.interface';\n\nexport const Section: React.FC<SectionProps> = ({\n  Comp = 'section',\n  maxWidth,\n  contentClassName,\n  className,\n  fullWidth = false,\n  children,\n  variant = 'accent',\n  bgImgPath,\n  ...props\n}) => {\n  return (\n    <Comp\n      className={cn(\n        'relative',\n        { 'lg:p-20': !fullWidth },\n        { 'md:p-15': !fullWidth },\n        { 'sm:px-6': !fullWidth },\n        { 'sm:py-10': !fullWidth },\n        { 'max-sm:p-6': !fullWidth },\n        { 'bg-background': variant === 'white' },\n        { 'bg-background-accent': variant === 'accent' },\n        { 'bg-background-light': variant === 'light' },\n        { 'bg-primary': variant === 'primary' },\n        { 'text-primary-foreground': variant === 'primary' },\n        { 'bg-transparent': bgImgPath },\n        { '[&_*]:relative': bgImgPath && fullWidth },\n        { '[&_*]:z-10': bgImgPath && fullWidth },\n        className,\n      )}\n      {...props}\n    >\n      {fullWidth ? (\n        children\n      ) : (\n        <div\n          className={cn('relative', 'z-10', { 'max-w-[1170px]': !maxWidth }, 'w-full', 'md:m-auto', contentClassName)}\n          style={maxWidth ? { maxWidth: `${maxWidth}px` } : undefined}\n        >\n          {children}\n        </div>\n      )}\n      {bgImgPath && <img src={bgImgPath} alt=\"background\" className=\"absolute inset-0 w-full h-full object-cover\" />}\n    </Comp>\n  );\n};\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}