{
  "$schema": "https://ui.shadcn.com/schema/registry.json",
  "name": "shadcn-lit-registry",
  "homepage": "https://github.com/lloydrichards/shadcn-lit-registry",
  "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
  "items": [
    {
      "name": "tailwind-mixin",
      "type": "registry:lib",
      "title": "Tailwind Mixin",
      "description": "A set of Tailwind CSS mixins for Lit components, enabling easy integration of Tailwind styles within web components.",
      "categories": ["ui", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "dependencies": [
        "tailwind-merge",
        "tw-animate-css",
        "class-variance-authority",
        "clsx"
      ],
      "files": [
        {
          "path": "registry/lib/tailwindMixin.ts",
          "type": "registry:lib"
        },
        {
          "path": "registry/lib/tailwindMixin.d.ts",
          "type": "registry:lib"
        },
        {
          "path": "registry/lib/utils.ts",
          "type": "registry:lib"
        }
      ],
      "docs": "IMPORTANT: You must create a Tailwind CSS global file. See setup instructions at https://lit-registry.lloydrichards.dev or copy the template from https://github.com/lloydrichards/shadcn-lit-registry/blob/main/registry/styles/tailwind.global.css"
    },
    {
      "name": "button",
      "type": "registry:component",
      "title": "Button",
      "description": "An atomic button component built with Lit and styled using Tailwind CSS. Supports multiple variants and sizes for versatile use in web applications.",
      "categories": ["ui", "button", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "dependencies": ["lucide-static"],
      "files": [
        {
          "path": "registry/ui/button/button.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/button/button.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "avatar",
      "type": "registry:component",
      "title": "Avatar",
      "description": "An image element with a fallback for representing the user. Built with Lit and styled using Tailwind CSS.",
      "categories": ["ui", "avatar", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "dependencies": [],
      "files": [
        {
          "path": "registry/ui/avatar/avatar.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/avatar/avatar.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "badge",
      "type": "registry:component",
      "title": "Badge",
      "description": "A badge component built with Lit and styled using Tailwind CSS. Supports multiple variants for different use cases.",
      "categories": ["ui", "badge", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "dependencies": [],
      "files": [
        {
          "path": "registry/ui/badge/badge.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/badge/badge.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "card",
      "type": "registry:component",
      "title": "Card",
      "description": "A card component built with Lit and styled using Tailwind CSS. Includes subcomponents for header, title, description, action, content, and footer.",
      "categories": ["ui", "card", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "registryDependencies": ["@lit/button"],
      "dependencies": [],
      "files": [
        {
          "path": "registry/ui/card/card.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/card/card.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "checkbox",
      "type": "registry:component",
      "title": "Checkbox",
      "description": "A control that allows the user to toggle between checked and not checked. Built with Lit and styled using Tailwind CSS. Supports form integration and indeterminate state.",
      "categories": ["ui", "form", "checkbox", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "dependencies": ["lucide-static"],
      "files": [
        {
          "path": "registry/ui/checkbox/checkbox.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/checkbox/checkbox.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "field",
      "type": "registry:component",
      "title": "Field",
      "description": "Form field components for creating accessible form layouts with labels, descriptions, and error messages. Includes fieldset, legend, and field grouping utilities.",
      "categories": ["ui", "form", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "registryDependencies": ["@lit/input"],
      "dependencies": [],
      "files": [
        {
          "path": "registry/ui/field/field.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/field/field.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "input",
      "type": "registry:component",
      "title": "Input",
      "description": "A text input component built with Lit and styled using Tailwind CSS. Supports various input types and states.",
      "categories": ["ui", "form", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "registryDependencies": ["@lit/button"],
      "dependencies": [],
      "files": [
        {
          "path": "registry/ui/input/input.stories.ts",
          "type": "registry:ui"
        }
      ],
      "css": {
        "@utility ui-input": {
          "@apply file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive": {}
        }
      }
    },
    {
      "name": "item",
      "type": "registry:component",
      "title": "Item",
      "description": "A versatile item component using named slots for flexible content composition. Includes group and separator components for organizing lists.",
      "categories": ["ui", "list", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "registryDependencies": ["@lit/button"],
      "dependencies": ["lucide-static"],
      "files": [
        {
          "path": "registry/ui/item/item.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/item/item.stories.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/item/item.slotted.css",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "popover",
      "type": "registry:component",
      "title": "Popover",
      "description": "A popover component built with Lit and styled using Tailwind CSS. Uses Floating UI for positioning with support for flip, shift, and arrow options.",
      "categories": ["ui", "popover", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "registryDependencies": ["@lit/button"],
      "dependencies": ["@floating-ui/dom", "lucide-static"],
      "files": [
        {
          "path": "registry/ui/popover/popover.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/popover/popover.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "tooltip",
      "type": "registry:component",
      "title": "Tooltip",
      "description": "A tooltip component that displays information when an element receives keyboard focus or the mouse hovers over it. Built with Lit and uses Floating UI for smart positioning.",
      "categories": ["ui", "tooltip", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "registryDependencies": ["@lit/popover", "@lit/button"],
      "dependencies": ["@floating-ui/dom", "lucide-static"],
      "files": [
        {
          "path": "registry/ui/tooltip/tooltip.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/tooltip/tooltip.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "select",
      "type": "registry:component",
      "title": "Select",
      "description": "Displays a list of options for the user to pick from—triggered by a button. Built with Lit and styled using Tailwind CSS. Features keyboard navigation, typeahead search, and form integration.",
      "categories": ["ui", "form", "select", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "registryDependencies": ["@lit/popover"],
      "dependencies": ["lucide-static"],
      "files": [
        {
          "path": "registry/ui/select/select.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/select/select.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "switch",
      "type": "registry:component",
      "title": "Switch",
      "description": "A control that allows the user to toggle between checked and not checked. Built with Lit and styled using Tailwind CSS. Supports controlled and uncontrolled modes with form integration.",
      "categories": ["ui", "form", "switch", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "dependencies": [],
      "files": [
        {
          "path": "registry/ui/switch/switch.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/switch/switch.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "tabs",
      "type": "registry:component",
      "title": "Tabs",
      "description": "A set of layered sections of content—known as tab panels—that are displayed one at a time. Built with Lit and styled using Tailwind CSS. Features keyboard navigation and accessible ARIA attributes.",
      "categories": ["ui", "tabs", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "dependencies": [],
      "files": [
        {
          "path": "registry/ui/tabs/tabs.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/tabs/tabs.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "toggle",
      "type": "registry:component",
      "title": "Toggle",
      "description": "A two-state button that can be either on or off. Built with Lit and styled using Tailwind CSS. Supports multiple variants and sizes with form integration.",
      "categories": ["ui", "toggle", "button", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "dependencies": ["lucide-static"],
      "files": [
        {
          "path": "registry/ui/toggle/toggle.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/toggle/toggle.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "toast",
      "type": "registry:component",
      "title": "Toast",
      "description": "An opinionated toast notification component for displaying messages. Built with Lit and styled using Tailwind CSS. Supports success, error, info, warning, and loading states with icons. Features promise support, action buttons, and multiple visual variants.",
      "categories": ["ui", "toast", "notification", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "registryDependencies": ["@lit/button"],
      "dependencies": ["lucide-static"],
      "files": [
        {
          "path": "registry/ui/toast/toast.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/toast/toast.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "table",
      "type": "registry:component",
      "title": "Table",
      "description": "A responsive table component for displaying tabular data. Uses a simple wrapper component with CSS-based styling for native HTML table elements.",
      "categories": ["ui", "table", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "dependencies": [],
      "files": [
        {
          "path": "registry/ui/table/table.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/table/table.stories.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/table/table.css",
          "type": "registry:ui"
        }
      ],
      "css": {
        "@layer ui-table": {
          "ui-table table": {
            "@apply w-full caption-bottom text-sm": {}
          },
          "ui-table thead": {
            "@apply [&_tr]:border-b": {}
          },
          "ui-table tbody": {
            "@apply [&_tr:last-child]:border-0": {}
          },
          "ui-table tfoot": {
            "@apply bg-muted/50 border-t font-medium [&>tr]:last:border-b-0": {}
          },
          "ui-table tr": {
            "@apply hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors": {}
          },
          "ui-table th": {
            "@apply text-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]": {}
          },
          "ui-table td": {
            "@apply p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]": {}
          },
          "ui-table caption": {
            "@apply text-muted-foreground mt-4 text-sm": {}
          }
        }
      }
    },
    {
      "name": "label",
      "type": "registry:component",
      "title": "Label",
      "description": "Renders an accessible label associated with controls.",
      "categories": ["ui", "form", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "dependencies": [],
      "files": [
        {
          "path": "registry/ui/label/label.stories.ts",
          "type": "registry:ui"
        }
      ],
      "css": {
        "@utility ui-label": {
          "@apply text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70": {}
        }
      }
    },
    {
      "name": "textarea",
      "type": "registry:component",
      "title": "Textarea",
      "description": "Displays a form textarea or a component that looks like a textarea.",
      "categories": ["ui", "form", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "dependencies": [],
      "files": [
        {
          "path": "registry/ui/textarea/textarea.stories.ts",
          "type": "registry:ui"
        }
      ],
      "css": {
        "@utility ui-textarea": {
          "@apply placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input min-h-[60px] w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive resize-y": {}
        }
      }
    },
    {
      "name": "dropdown-menu",
      "type": "registry:component",
      "title": "Dropdown Menu",
      "description": "Displays a menu to the user—such as a set of actions or functions—triggered by a button. Supports nested submenus, checkbox items, radio groups, keyboard navigation, and accessibility features.",
      "categories": ["ui", "menu", "dropdown", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "registryDependencies": ["@lit/popover"],
      "dependencies": ["lucide-static", "@floating-ui/dom"],
      "files": [
        {
          "path": "registry/ui/dropdown-menu/dropdown-menu.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/dropdown-menu/dropdown-menu.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "context-menu",
      "type": "registry:component",
      "title": "Context Menu",
      "description": "Displays a menu to the user at the cursor position when right-clicking on a trigger area. Supports checkboxes, radio groups, nested submenus, keyboard navigation, and accessibility features.",
      "categories": ["ui", "menu", "context-menu", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "registryDependencies": ["@lit/popover"],
      "dependencies": ["lucide-static", "@floating-ui/dom"],
      "files": [
        {
          "path": "registry/ui/context-menu/context-menu.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/context-menu/context-menu.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "menubar",
      "type": "registry:component",
      "title": "Menubar",
      "description": "A visually persistent menu common in desktop applications that provides quick access to a consistent set of commands. Features horizontal keyboard navigation and accessible ARIA attributes.",
      "categories": ["ui", "navigation", "menu", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "registryDependencies": ["@lit/popover"],
      "dependencies": ["lucide-static", "@floating-ui/dom"],
      "files": [
        {
          "path": "registry/ui/menubar/menubar.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/menubar/menubar.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "command",
      "type": "registry:component",
      "title": "Command",
      "description": "Fast, composable, unstyled command menu component. Features search/filtering, keyboard navigation, item grouping, and accessibility support. Based on the cmdk library pattern.",
      "categories": ["ui", "command", "search", "menu", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "dependencies": ["lucide-static"],
      "files": [
        {
          "path": "registry/ui/command/command.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/command/command.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "dialog",
      "type": "registry:component",
      "title": "Dialog",
      "description": "A modal dialog component that overlays content on the primary window. Uses native HTML dialog element with smooth animations, focus management, and accessibility features. Supports ESC key and backdrop click to close.",
      "categories": ["ui", "dialog", "modal", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "dependencies": ["lucide-static"],
      "files": [
        {
          "path": "registry/ui/dialog/dialog.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "accordion",
      "type": "registry:component",
      "title": "Accordion",
      "description": "A vertically stacked set of interactive headings that each reveal a section of content. Supports single and multiple open items with smooth animations and full keyboard navigation.",
      "categories": ["ui", "accordion", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "dependencies": ["lucide-static"],
      "files": [
        {
          "path": "registry/ui/accordion/accordion.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/accordion/accordion.stories.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "collapsible",
      "type": "registry:component",
      "title": "Collapsible",
      "description": "An interactive component which expands/collapses a panel. Useful for showing and hiding content with smooth animations and accessibility features.",
      "categories": ["ui", "collapsible", "web-component"],
      "author": "Lloyd Richards <lloyd.d.richards@gmail.com>",
      "dependencies": ["lucide-static"],
      "files": [
        {
          "path": "registry/ui/collapsible/collapsible.ts",
          "type": "registry:ui"
        },
        {
          "path": "registry/ui/collapsible/collapsible.stories.ts",
          "type": "registry:ui"
        }
      ]
    }
  ]
}
