{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "extends": "none",
  "name": "grid-list",
  "title": "grid-list",
  "description": "grid-list",
  "dependencies": [
    "react-aria-components",
    "tailwind-merge"
  ],
  "registryDependencies": [
    "https://intentui.com/r/primitive",
    "https://intentui.com/r/checkbox"
  ],
  "files": [
    {
      "path": "src/components/ui/grid-list.tsx",
      "content": "'use client'\n\nimport { Button } from 'react-aria-components/Button'\nimport type { GridListItemProps, GridListProps } from 'react-aria-components/GridList'\nimport {\n  GridList as GridListPrimitive,\n  GridListHeader as GridListHeaderPrimitive,\n  GridListItem as GridListItemPrimitive,\n  GridListSection as GridListSectionPrimitive,\n} from 'react-aria-components/GridList'\nimport { Text, type TextProps } from 'react-aria-components/Text'\nimport { twMerge } from 'tailwind-merge'\nimport { cx } from '@/lib/primitive'\nimport { Checkbox, CheckboxField } from './checkbox'\n\nconst GridList = <T extends object>({ className, ...props }: GridListProps<T>) => (\n  <GridListPrimitive\n    data-slot=\"grid-list\"\n    className={cx(\n      'relative divide-y overflow-hidden rounded-lg border bg-bg *:drop-target:border-accent sm:text-sm/6 dark:bg-muted',\n      className\n    )}\n    {...props}\n  />\n)\n\nconst GridListSection = <T extends object>({\n  className,\n  ...props\n}: React.ComponentProps<typeof GridListSectionPrimitive<T>>) => {\n  return (\n    <GridListSectionPrimitive\n      data-slot=\"grid-list-section\"\n      className={twMerge('divide-y', className)}\n      {...props}\n    />\n  )\n}\n\nconst GridListHeader = ({\n  className,\n  ...props\n}: React.ComponentProps<typeof GridListHeaderPrimitive>) => {\n  return (\n    <GridListHeaderPrimitive\n      data-slot=\"grid-list-header\"\n      className={twMerge('px-3 py-2.5 font-semibold text-sm/6', className)}\n      {...props}\n    />\n  )\n}\n\nconst GridListItem = ({ className, children, ...props }: GridListItemProps) => {\n  const textValue = typeof children === 'string' ? children : undefined\n  return (\n    <GridListItemPrimitive\n      textValue={textValue}\n      {...props}\n      className={cx(\n        'group relative min-w-0 px-3 py-2.5 outline-hidden [--me-icon:--spacing(2)]',\n        'flex min-w-0 cursor-default items-center gap-2 sm:gap-2.5',\n        'dragging:cursor-grab dragging:opacity-70 dragging:**:[[slot=drag]]:text-fg',\n        \"hover:bg-accent/50 **:[svg:not([data-slot='check-indicator'])]:size-5 **:[svg:not([data-slot='check-indicator'])]:shrink-0 **:[svg:not([data-slot='check-indicator'])]:text-muted-fg sm:**:[svg:not([data-slot='check-indicator'])]:size-4\",\n        'selected:bg-accent/40 selected:text-fg selected:hover:bg-accent/80 selected:**:[.text-muted-fg]:text-accent-fg/80',\n        'href' in props && 'cursor-pointer',\n        className\n      )}\n    >\n      {(values) => (\n        <>\n          {values.allowsDragging && (\n            <Button slot=\"drag\">\n              <svg\n                data-slot=\"drag-icon\"\n                className=\"size-5 text-muted-fg sm:size-4\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n              >\n                <path\n                  d=\"M11 5.5C11 6.32843 10.3284 7 9.5 7C8.67157 7 8 6.32843 8 5.5C8 4.67157 8.67157 4 9.5 4C10.3284 4 11 4.67157 11 5.5Z\"\n                  fill=\"currentColor\"\n                />\n                <path\n                  d=\"M16 5.5C16 6.32843 15.3284 7 14.5 7C13.6716 7 13 6.32843 13 5.5C13 4.67157 13.6716 4 14.5 4C15.3284 4 16 4.67157 16 5.5Z\"\n                  fill=\"currentColor\"\n                />\n                <path\n                  d=\"M11 18.5C11 19.3284 10.3284 20 9.5 20C8.67157 20 8 19.3284 8 18.5C8 17.6716 8.67157 17 9.5 17C10.3284 17 11 17.6716 11 18.5Z\"\n                  fill=\"currentColor\"\n                />\n                <path\n                  d=\"M16 18.5C16 19.3284 15.3284 20 14.5 20C13.6716 20 13 19.3284 13 18.5C13 17.6716 13.6716 17 14.5 17C15.3284 17 16 17.6716 16 18.5Z\"\n                  fill=\"currentColor\"\n                />\n                <path\n                  d=\"M11 12C11 12.8284 10.3284 13.5 9.5 13.5C8.67157 13.5 8 12.8284 8 12C8 11.1716 8.67157 10.5 9.5 10.5C10.3284 10.5 11 11.1716 11 12Z\"\n                  fill=\"currentColor\"\n                />\n                <path\n                  d=\"M16 12C16 12.8284 15.3284 13.5 14.5 13.5C13.6716 13.5 13 12.8284 13 12C13 11.1716 13.6716 10.5 14.5 10.5C15.3284 10.5 16 11.1716 16 12Z\"\n                  fill=\"currentColor\"\n                />\n              </svg>\n            </Button>\n          )}\n\n          {values.selectionMode === 'multiple' && values.selectionBehavior === 'toggle' && (\n            <CheckboxField className=\"gap-x-0\" slot=\"selection\">\n              <Checkbox className=\"col-span-1\" />\n            </CheckboxField>\n          )}\n          {typeof children === 'function' ? children(values) : children}\n        </>\n      )}\n    </GridListItemPrimitive>\n  )\n}\n\nconst GridListEmptyState = ({ ref, className, ...props }: React.ComponentProps<'div'>) => (\n  <div ref={ref} className={twMerge('p-6', className)} {...props} />\n)\n\nconst GridListSpacer = ({ className, ref, ...props }: React.ComponentProps<'div'>) => {\n  return <div ref={ref} aria-hidden className={twMerge('-ms-4 flex-1', className)} {...props} />\n}\n\nconst GridListStart = ({ className, ref, ...props }: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      ref={ref}\n      className={twMerge('relative flex items-center gap-x-2.5 sm:gap-x-3', className)}\n      {...props}\n    />\n  )\n}\n\ninterface GridListTextProps extends TextProps {\n  ref?: React.Ref<HTMLDivElement>\n}\n\nconst GridListLabel = ({ className, ref, ...props }: GridListTextProps) => (\n  <Text ref={ref} className={twMerge('font-medium', className)} {...props} />\n)\n\nconst GridListDescription = ({ className, ref, ...props }: GridListTextProps) => (\n  <Text\n    slot=\"description\"\n    ref={ref}\n    className={twMerge('font-normal text-muted-fg text-sm', className)}\n    {...props}\n  />\n)\n\nexport type { GridListItemProps, GridListProps }\nexport {\n  GridList,\n  GridListDescription,\n  GridListEmptyState,\n  GridListHeader,\n  GridListItem,\n  GridListLabel,\n  GridListSection,\n  GridListSpacer,\n  GridListStart,\n}\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}