{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "types",
  "type": "registry:lib",
  "title": "Shared types",
  "description": "Types that every section uses: heading levels, image and link components you can replace, and call-to-action items.",
  "files": [
    {
      "path": "src/lib/types.ts",
      "type": "registry:lib",
      "target": "lib/types.ts",
      "content": "/**\n * Shared contracts for every Facade UI section.\n *\n * Framework neutrality: nothing here imports from `next/*`. Sections that render\n * images or links inside data-driven lists take a *component type* rather than a\n * render callback, so `next/image` and `next/link` can be handed over directly\n * and still work inside React Server Components:\n *\n *   import Image from \"next/image\"\n *   <LogoCloud items={logos} image={Image} />\n *\n * One-off media uses a `media` ReactNode slot instead — no indirection needed.\n *\n * a11y: `HeadingLevel` exists so a section never hard-codes `<h2>`. Whoever\n * places the section knows the surrounding outline; the section does not.\n *\n * Dependencies: react (types only).\n */\n\nimport type { ElementType, ReactNode } from \"react\"\n\n/** `<h1>` is reserved for the page; sections start at `<h2>`. */\nexport type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6\n\n/** Maps a heading level to its tag. Use the `Heading` atom to render one. */\nexport type HeadingTag = `h${HeadingLevel}`\n\n/**\n * The image props that sections pass to your image component. All are valid DOM\n * attributes, so the default `\"img\"` element works, and they also match `next/image`.\n */\nexport interface FacadeImageProps {\n  src: string\n  /** Required. Pass `\"\"` only for decorative images. */\n  alt: string\n  width?: number\n  height?: number\n  className?: string\n  sizes?: string\n  loading?: \"eager\" | \"lazy\"\n  decoding?: \"async\" | \"auto\" | \"sync\"\n  fetchPriority?: \"high\" | \"low\" | \"auto\"\n}\n\n/** Drop-in for `next/image`, or the default `\"img\"`. */\nexport type ImageComponent = ElementType<FacadeImageProps>\n\n/** The link props that sections pass to your link component. */\nexport interface FacadeLinkProps {\n  href: string\n  children?: ReactNode\n  className?: string\n  target?: string\n  rel?: string\n  \"aria-current\"?: \"page\" | \"step\" | \"location\" | \"date\" | \"time\" | \"true\" | \"false\"\n  \"aria-label\"?: string\n}\n\n/** Drop-in for `next/link`, or the default `\"a\"`. */\nexport type LinkComponent = ElementType<FacadeLinkProps>\n\n/**\n * Any icon component. Structural rather than nominal, so `lucide-react`,\n * `@heroicons/react`, a local SVG component, or anything else that accepts\n * SVG props can be passed without the registry depending on that library.\n *\n * One React Server Components caveat, which bites in exactly one place: an icon\n * component cannot be passed as a prop *across* a server-to-client boundary.\n * Most icon libraries, `lucide-react` included, do not mark their modules\n * `\"use client\"`, so the reference is a plain function that React refuses to\n * serialise. Static sections are server components and render icons in the same\n * tree, so they are unaffected. A `-motion` variant *is* a client component, so\n * whatever renders it must be a client component too. Adding `\"use client\"` to\n * the file that passes the icons is the whole fix.\n */\nexport type IconComponent = ElementType<{\n  className?: string\n  \"aria-hidden\"?: boolean | \"true\" | \"false\"\n  strokeWidth?: number | string\n  focusable?: boolean | \"true\" | \"false\"\n}>\n\n/** A call to action rendered by `CtaGroup` and by most sections' `actions` slot. */\nexport interface CtaItem {\n  label: string\n  href: string\n  /** Defaults to `primary` for the first action and `outline` for the rest. */\n  variant?: \"primary\" | \"secondary\" | \"outline\" | \"ghost\"\n  /** Set for links that leave the site; adds `rel=\"noopener noreferrer\"`. */\n  external?: boolean\n  \"aria-label\"?: string\n}\n\n/**\n * Lets you replace the elements a section uses for its list.\n *\n * By default a section renders `ul` and `li`. The `-motion` variant passes `Stagger` and\n * `StaggerItem` instead, so items animate one by one while the static file imports\n * nothing from `motion`.\n */\nexport interface ListSlotProps {\n  /** Wraps the list. Defaults to `\"ul\"`. */\n  listAs?: ElementType\n  /** Wraps each item. Defaults to `\"li\"`. */\n  itemAs?: ElementType\n}\n\n/**\n * The same as `ListSlotProps`, for sections made of stacked blocks instead of a list,\n * such as heroes and CTA bands.\n *\n * By default a section renders `div`s. The `-motion` variant passes `Stagger` and\n * `StaggerItem`, so the eyebrow, headline, text and buttons appear in sequence.\n */\nexport interface StackSlotProps {\n  /** Wraps the content stack. Defaults to `\"div\"`. */\n  stackAs?: ElementType\n  /** Wraps each block in the stack. Defaults to `\"div\"`. */\n  blockAs?: ElementType\n}\n\n/** Props shared by every section. */\nexport interface SectionBaseProps {\n  /** Heading level for the section's own title. Defaults to `2`. */\n  headingLevel?: HeadingLevel\n  /**\n   * Root element. Defaults to `\"section\"`. Use `\"div\"` when it is already inside a\n   * `<section>`.\n   */\n  as?: \"section\" | \"div\" | \"article\" | \"aside\"\n  className?: string\n  /** Vertical spacing. Uses the `--facade-section-y*` tokens. */\n  spacing?: \"sm\" | \"md\" | \"lg\" | \"none\"\n  id?: string\n}\n"
    }
  ],
  "docs": "Import styles/facade-tokens.css in your global stylesheet, after @import \"tailwindcss\". Docs: https://facadeui.dev/components/types"
}