{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "cart-line-item",
  "type": "registry:ui",
  "title": "Cart line item",
  "description": "React shopping cart row with product title, unit price, a quantity stepper and an optional remove button. Callbacks report quantity changes and removals.",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "https://ui.minidev.pro/r/icon-button.json",
    "https://ui.minidev.pro/r/quantity-stepper.json",
    "utils"
  ],
  "files": [
    {
      "path": "registry/ui/cart-line-item.tsx",
      "type": "registry:ui",
      "target": "components/ui/cart-line-item.tsx",
      "content": "\"use client\"\nimport * as React from \"react\"\nimport { XIcon } from \"lucide-react\"\nimport { cn } from \"@/lib/utils\"\nimport { QuantityStepper } from \"@/components/ui/quantity-stepper\"\nimport { IconButton } from \"@/components/ui/icon-button\"\n\nfunction CartLineItem({\n  title,\n  price,\n  quantity,\n  onQuantityChange,\n  onRemove,\n  className,\n}: {\n  title: string\n  price: string\n  quantity: number\n  onQuantityChange?: (n: number) => void\n  onRemove?: () => void\n  className?: string\n}) {\n  return (\n    <div data-slot=\"cart-line-item\" className={cn(\"flex items-center gap-3 border-b border-border py-3\", className)}>\n      <div className=\"min-w-0 flex-1\">\n        <p className=\"truncate text-sm font-medium text-fg\">{title}</p>\n        <p className=\"text-xs tabular-nums text-fg-muted\">{price}</p>\n      </div>\n      <QuantityStepper value={quantity} onChange={(n) => onQuantityChange?.(n)} />\n      {onRemove ? (\n        <IconButton type=\"button\" variant=\"ghost\" size=\"icon-sm\" aria-label={`Remove ${title}`} onClick={onRemove}>\n          <XIcon />\n        </IconButton>\n      ) : null}\n    </div>\n  )\n}\nexport { CartLineItem }\n"
    }
  ]
}