{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "item",
  "title": "Item",
  "description": "Flexible row layout with leading media, content, and trailing actions.",
  "dependencies": [
    "@vllnt/ui@^0.2.1"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/default/item/item.tsx",
      "content": "import * as React from \"react\";\n\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"@vllnt/ui\";\n\nconst itemVariants = cva(\"flex items-center gap-3 rounded-md text-sm\", {\n  defaultVariants: {\n    size: \"default\",\n    variant: \"default\",\n  },\n  variants: {\n    size: {\n      default: \"p-3\",\n      sm: \"p-2\",\n    },\n    variant: {\n      default: \"\",\n      muted: \"bg-muted/50\",\n      outline: \"border border-border\",\n    },\n  },\n});\n\n/** Flexible row with leading media, content, and trailing actions. */\nexport type ItemProps = React.ComponentPropsWithoutRef<\"div\"> &\n  VariantProps<typeof itemVariants>;\n\nconst Item = ({\n  className,\n  ref,\n  size,\n  variant,\n  ...props\n}: ItemProps & { ref?: React.Ref<HTMLDivElement> }) => (\n  <div\n    className={cn(itemVariants({ size, variant }), className)}\n    data-slot=\"item\"\n    ref={ref}\n    {...props}\n  />\n);\nItem.displayName = \"Item\";\n\n/** Leading slot for an icon, avatar, or thumbnail. */\nexport type ItemMediaProps = React.ComponentPropsWithoutRef<\"div\">;\n\nconst ItemMedia = ({\n  className,\n  ref,\n  ...props\n}: ItemMediaProps & { ref?: React.Ref<HTMLDivElement> }) => (\n  <div\n    className={cn(\n      \"flex shrink-0 items-center justify-center [&_svg]:size-5\",\n      className,\n    )}\n    data-slot=\"item-media\"\n    ref={ref}\n    {...props}\n  />\n);\nItemMedia.displayName = \"ItemMedia\";\n\n/** Stacked title and description in the middle of an Item. */\nexport type ItemContentProps = React.ComponentPropsWithoutRef<\"div\">;\n\nconst ItemContent = ({\n  className,\n  ref,\n  ...props\n}: ItemContentProps & { ref?: React.Ref<HTMLDivElement> }) => (\n  <div\n    className={cn(\"flex min-w-0 flex-1 flex-col gap-0.5\", className)}\n    data-slot=\"item-content\"\n    ref={ref}\n    {...props}\n  />\n);\nItemContent.displayName = \"ItemContent\";\n\n/** Primary line of text inside an ItemContent. */\nexport type ItemTitleProps = React.ComponentPropsWithoutRef<\"div\">;\n\nconst ItemTitle = ({\n  className,\n  ref,\n  ...props\n}: ItemTitleProps & { ref?: React.Ref<HTMLDivElement> }) => (\n  <div\n    className={cn(\"font-medium leading-none\", className)}\n    data-slot=\"item-title\"\n    ref={ref}\n    {...props}\n  />\n);\nItemTitle.displayName = \"ItemTitle\";\n\n/** Secondary muted line of text inside an ItemContent. */\nexport type ItemDescriptionProps = React.ComponentPropsWithoutRef<\"p\">;\n\nconst ItemDescription = ({\n  className,\n  ref,\n  ...props\n}: ItemDescriptionProps & { ref?: React.Ref<HTMLParagraphElement> }) => (\n  <p\n    className={cn(\"text-sm text-muted-foreground\", className)}\n    data-slot=\"item-description\"\n    ref={ref}\n    {...props}\n  />\n);\nItemDescription.displayName = \"ItemDescription\";\n\n/** Trailing slot for actions such as buttons or switches. */\nexport type ItemActionsProps = React.ComponentPropsWithoutRef<\"div\">;\n\nconst ItemActions = ({\n  className,\n  ref,\n  ...props\n}: ItemActionsProps & { ref?: React.Ref<HTMLDivElement> }) => (\n  <div\n    className={cn(\"flex shrink-0 items-center gap-2\", className)}\n    data-slot=\"item-actions\"\n    ref={ref}\n    {...props}\n  />\n);\nItemActions.displayName = \"ItemActions\";\n\nexport {\n  Item,\n  ItemActions,\n  ItemContent,\n  ItemDescription,\n  ItemMedia,\n  ItemTitle,\n  itemVariants,\n};\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component",
  "version": "0.2.1",
  "stability": "stable"
}