{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "list",
  "type": "registry:ui",
  "dependencies": [
    "clsx",
    "tailwind-merge"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "list.tsx",
      "target": "components/ui/list.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\n\nconst ListContext = React.createContext<React.ReactNode>(null);\n\nexport interface ListProps extends React.HTMLAttributes<HTMLElement> {\n  as?: \"ul\" | \"ol\";\n  /** Decorative marker rendered on every item. An item may override it. */\n  marker?: React.ReactNode;\n  /** Rule between items, stopping at the last one. */\n  divided?: boolean;\n}\n\nexport const List = React.forwardRef<HTMLElement, ListProps>(\n  (\n    { className, as: Comp = \"ul\", marker, divided, children, ...props },\n    ref,\n  ) => (\n    <ListContext.Provider value={marker ?? null}>\n      <Comp\n        ref={ref as React.Ref<HTMLUListElement & HTMLOListElement>}\n        className={cn(\n          \"flex list-none flex-col\",\n          divided &&\n            \"[&>li]:border-b [&>li]:border-border [&>li:last-child]:border-0\",\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </Comp>\n    </ListContext.Provider>\n  ),\n);\nList.displayName = \"List\";\n\nexport interface ListItemProps extends React.LiHTMLAttributes<HTMLLIElement> {\n  /** Overrides the list's shared marker for this item alone. */\n  marker?: React.ReactNode;\n}\n\nexport const ListItem = React.forwardRef<HTMLLIElement, ListItemProps>(\n  ({ className, marker, children, ...props }, ref) => {\n    const shared = React.useContext(ListContext);\n    const shown = marker ?? shared;\n    return (\n      <li\n        ref={ref}\n        className={cn(\n          \"flex items-start gap-3 px-3 py-4 text-muted\",\n          \"transition-tint duration-fast ease-soft hover:text-ink motion-reduce:transition-none\",\n          className,\n        )}\n        {...props}\n      >\n        {shown != null && (\n          <span\n            data-list-marker=\"\"\n            aria-hidden=\"true\"\n            className=\"mt-0.5 shrink-0 text-accent-alt [&_svg]:size-4\"\n          >\n            {shown}\n          </span>\n        )}\n        <span className=\"min-w-0 flex-1\">{children}</span>\n      </li>\n    );\n  },\n);\nListItem.displayName = \"ListItem\";\n"
    }
  ]
}