{
  "$schema": "https://ui.shadcn.com/schema/registry.json",
  "name": "channel3",
  "homepage": "https://github.com/channel3-ai/channel3-ui",
  "items": [
    {
      "name": "format",
      "type": "registry:lib",
      "title": "Format helpers",
      "description": "Price, currency, discount, domain, availability, and image helpers for Channel3 product data.",
      "dependencies": ["@channel3/sdk"],
      "files": [{ "path": "registry/default/lib/format.ts", "type": "registry:lib" }]
    },
    {
      "name": "variants",
      "type": "registry:lib",
      "title": "Variant helpers",
      "description": "Classifies variant option values into display tiers from `exists` and `available`.",
      "dependencies": ["@channel3/sdk"],
      "registryDependencies": ["@channel3/format"],
      "files": [{ "path": "registry/default/lib/variants.ts", "type": "registry:lib" }]
    },
    {
      "name": "use-in-viewport",
      "type": "registry:hook",
      "title": "useInViewport",
      "description": "Fires a callback when an element enters the viewport via IntersectionObserver, with one-shot and repeating modes for lazy sections and infinite-scroll sentinels.",
      "files": [
        { "path": "registry/default/hooks/use-in-viewport.ts", "type": "registry:hook" }
      ]
    },
    {
      "name": "use-variant-selection",
      "type": "registry:hook",
      "title": "useVariantSelection",
      "description": "Manages variant selection and server-side re-resolution via an injected resolver, keeping the API key on your server.",
      "dependencies": ["@channel3/sdk", "@tanstack/react-query"],
      "registryDependencies": ["@channel3/variants"],
      "files": [
        { "path": "registry/default/hooks/use-variant-selection.ts", "type": "registry:hook" }
      ]
    },
    {
      "name": "search",
      "type": "registry:lib",
      "title": "Search filter helpers",
      "description": "UI-friendly search filter state, conversion to the SDK SearchFilters payload, option lists, color presets, and hex helpers.",
      "dependencies": ["@channel3/sdk"],
      "files": [{ "path": "registry/default/lib/search.ts", "type": "registry:lib" }]
    },
    {
      "name": "use-product-recommendations",
      "type": "registry:hook",
      "title": "useProductRecommendations",
      "description": "Lazily fetches similar products when the section scrolls into view, via an injected fetcher, so it never blocks the PDP.",
      "dependencies": ["@channel3/sdk", "@tanstack/react-query"],
      "registryDependencies": ["@channel3/use-in-viewport"],
      "files": [
        {
          "path": "registry/default/hooks/use-product-recommendations.ts",
          "type": "registry:hook"
        }
      ]
    },
    {
      "name": "use-async-options",
      "type": "registry:hook",
      "title": "useAsyncOptions",
      "description": "Debounced typeahead loader for brand/category suggestions, delegating to an injected server-side fetcher.",
      "dependencies": ["@tanstack/react-query"],
      "files": [
        { "path": "registry/default/hooks/use-async-options.ts", "type": "registry:hook" }
      ]
    },
    {
      "name": "use-product-search",
      "type": "registry:hook",
      "title": "useProductSearch",
      "description": "Query + filter state, debounced search, and infinite-scroll pagination via TanStack Query and an injected search fetcher.",
      "dependencies": ["@channel3/sdk", "@tanstack/react-query"],
      "registryDependencies": [
        "@channel3/search",
        "@channel3/use-in-viewport"
      ],
      "files": [
        { "path": "registry/default/hooks/use-product-search.ts", "type": "registry:hook" }
      ]
    },
    {
      "name": "price-range-gauge",
      "type": "registry:component",
      "title": "Price Range Gauge",
      "description": "Plots the current price against its historical range as low/typical/high zones with a tick at the current price.",
      "dependencies": ["@channel3/sdk"],
      "registryDependencies": ["@channel3/format"],
      "files": [
        { "path": "registry/default/components/price-range-gauge.tsx", "type": "registry:component" }
      ]
    },
    {
      "name": "price-history-chart",
      "type": "registry:component",
      "title": "Price History Chart",
      "description": "Area chart of a product's price over time, built on the shadcn chart wrapper.",
      "dependencies": ["@channel3/sdk", "recharts"],
      "registryDependencies": ["chart", "empty", "@channel3/format"],
      "files": [
        {
          "path": "registry/default/components/price-history-chart.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "product-card",
      "type": "registry:component",
      "title": "Product Card",
      "description": "Borderless, image-forward product tile with hover image-swap and color swatches, for grids and carousels. Includes a loading skeleton.",
      "dependencies": ["@channel3/sdk", "lucide-react"],
      "registryDependencies": ["badge", "skeleton", "@channel3/format", "@channel3/variants"],
      "files": [
        { "path": "registry/default/components/product-card.tsx", "type": "registry:component" }
      ]
    },
    {
      "name": "offers-list",
      "type": "registry:component",
      "title": "Offers List",
      "description": "Compares merchant offers for a product, cheapest first, with affiliate-tracked buy links.",
      "dependencies": ["@channel3/sdk", "lucide-react"],
      "registryDependencies": ["badge", "button", "empty", "@channel3/format"],
      "files": [
        { "path": "registry/default/components/offers-list.tsx", "type": "registry:component" }
      ]
    },
    {
      "name": "image-gallery",
      "type": "registry:component",
      "title": "Image Gallery",
      "description": "Product image carousel with a synced thumbnail strip.",
      "dependencies": ["@channel3/sdk", "lucide-react"],
      "registryDependencies": ["carousel"],
      "files": [
        { "path": "registry/default/components/image-gallery.tsx", "type": "registry:component" }
      ]
    },
    {
      "name": "variant-selector",
      "type": "registry:component",
      "title": "Variant Selector",
      "description": "Renders every variant dimension as pills or swatches with three tiers of emphasis (purchasable, out-of-stock, not-offered).",
      "dependencies": ["@channel3/sdk"],
      "registryDependencies": ["@channel3/variants"],
      "files": [
        { "path": "registry/default/components/variant-selector.tsx", "type": "registry:component" }
      ]
    },
    {
      "name": "product-attributes",
      "type": "registry:component",
      "title": "Product Attributes",
      "description": "Renders a product's extracted attributes (structured_attributes plus materials, gender, and age) as a two-column definition list.",
      "dependencies": ["@channel3/sdk"],
      "files": [
        { "path": "registry/default/components/product-attributes.tsx", "type": "registry:component" }
      ]
    },
    {
      "name": "product-grid",
      "type": "registry:component",
      "title": "Product Grid",
      "description": "Responsive grid of product cards with loading skeletons and an empty state.",
      "dependencies": ["@channel3/sdk"],
      "registryDependencies": ["empty", "@channel3/product-card"],
      "files": [
        { "path": "registry/default/components/product-grid.tsx", "type": "registry:component" }
      ]
    },
    {
      "name": "product-carousel",
      "type": "registry:component",
      "title": "Product Carousel",
      "description": "Horizontally scrollable row of product cards with nav controls (e.g. \"More like this\").",
      "dependencies": ["@channel3/sdk"],
      "registryDependencies": ["carousel", "@channel3/product-card"],
      "files": [
        { "path": "registry/default/components/product-carousel.tsx", "type": "registry:component" }
      ]
    },
    {
      "name": "product-details",
      "type": "registry:block",
      "title": "Product Details (PDP)",
      "description": "Compound product detail page: gallery, header (all brands), variant selection, offers, price history, description, attributes, and an optional 'you might also like' carousel. Pairs with useVariantSelection.",
      "dependencies": ["@channel3/sdk"],
      "registryDependencies": [
        "separator",
        "@channel3/image-gallery",
        "@channel3/offers-list",
        "@channel3/variant-selector",
        "@channel3/price-range-gauge",
        "@channel3/price-history-chart",
        "@channel3/product-attributes",
        "@channel3/product-recommendations",
        "@channel3/use-product-recommendations",
        "@channel3/use-variant-selection",
        "@channel3/format"
      ],
      "files": [
        { "path": "registry/default/components/product-details.tsx", "type": "registry:block" }
      ]
    },
    {
      "name": "product-recommendations",
      "type": "registry:component",
      "title": "Product Recommendations",
      "description": "Lazy \"you might also like\" carousel for a PDP: defers the findSimilar fetch until it scrolls into view and hides itself when empty.",
      "dependencies": ["@channel3/sdk"],
      "registryDependencies": ["@channel3/product-carousel", "@channel3/use-product-recommendations"],
      "files": [
        {
          "path": "registry/default/components/product-recommendations.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "search-bar",
      "type": "registry:component",
      "title": "Search Bar",
      "description": "Controlled search input with submit-on-Enter, a clear button, and an optional image-search trigger.",
      "dependencies": ["lucide-react"],
      "registryDependencies": ["button", "input"],
      "files": [
        { "path": "registry/default/components/search-bar.tsx", "type": "registry:component" }
      ]
    },
    {
      "name": "product-filters",
      "type": "registry:component",
      "title": "Product Filters",
      "description": "Compound, configurable filter panel (stacked sidebar or horizontal popover bar): price, gender, age, condition, availability, hex color palette with opt-in percentages, brand and category typeahead, and category-scoped attribute filters.",
      "dependencies": ["@channel3/sdk", "lucide-react", "react-colorful"],
      "registryDependencies": [
        "accordion",
        "badge",
        "button",
        "input",
        "slider",
        "popover",
        "@channel3/search",
        "@channel3/use-async-options"
      ],
      "files": [
        { "path": "registry/default/components/product-filters.tsx", "type": "registry:component" }
      ]
    },
    {
      "name": "product-search",
      "type": "registry:block",
      "title": "Product Search",
      "description": "Batteries-included search experience: search bar, configurable filters, and an infinite-scroll results grid wired to useProductSearch.",
      "dependencies": ["@channel3/sdk", "lucide-react"],
      "registryDependencies": [
        "button",
        "@channel3/product-grid",
        "@channel3/search-bar",
        "@channel3/product-filters",
        "@channel3/use-product-search"
      ],
      "files": [
        { "path": "registry/default/components/product-search.tsx", "type": "registry:block" }
      ]
    },
    {
      "name": "all",
      "type": "registry:block",
      "title": "Channel3 — everything",
      "description": "Installs the full Channel3 UI kit: every component, hook, and lib in the registry.",
      "registryDependencies": ["@channel3/product-search", "@channel3/product-details"],
      "files": []
    }
  ]
}