{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "dependencies": [
    "@base-ui/react@1.8.0"
  ],
  "description": "Stacked disclosure panels with real headings and a height-measured open animation.",
  "docs": "Two steps after installing: import the copied stylesheet once at your app entry — it lands at `styles/liquefy-ui.css` — or `@import` it from your global CSS *before* `tailwindcss`, so Tailwind utilities keep winning over component styles. Then wrap the tree in `<LiquefyProvider>`, which is where every component reads its tokens from. Every copied file already carries its own 'use client' directive. Full documentation: https://liquefy-ui.com/#/docs/installation",
  "files": [
    {
      "content": "'use client'\n\nimport { Accordion } from '@base-ui/react/accordion'\nimport { forwardRef, type HTMLAttributes, type ReactNode } from 'react'\nimport { ChevronDownGlyph } from '@/lib/internal-glyphs'\nimport { LiquidSurface, type LiquidSurfaceProps } from '@/components/ui/liquid-surface'\nimport { useLiquidStyles, type LiquidStyleProps } from '@/lib/styles-prop'\n\n// Base UI owns the roving focus across headers, the aria-controls wiring and the\n// panel height measurement (exposed as --accordion-panel-height). liquefy-ui keeps\n// the glass surface, the chevron and the jelly open animation.\n\nexport type LiquidAccordionProps = Omit<LiquidSurfaceProps, 'children' | 'defaultValue'> & {\n  children: ReactNode\n  defaultValue?: string[]\n  multiple?: boolean\n  onValueChange?: (value: string[]) => void\n  value?: string[]\n}\n\nexport const LiquidAccordion = forwardRef<HTMLDivElement, LiquidAccordionProps>(({\n  children,\n  className,\n  defaultValue = [],\n  multiple = false,\n  onValueChange,\n  value,\n  ...props\n}, ref) => (\n  <Accordion.Root\n    defaultValue={defaultValue}\n    multiple={multiple}\n    onValueChange={(next) => onValueChange?.(next.map(String))}\n    render={(\n      <LiquidSurface\n        className={['lq-accordion', className].filter(Boolean).join(' ')}\n        interactive={false}\n        ref={ref}\n        {...props}\n      />\n    )}\n    value={value}\n  >\n    {children}\n  </Accordion.Root>\n))\n\nLiquidAccordion.displayName = 'LiquidAccordion'\n\n// `title` is omitted because HTMLAttributes declares it as the tooltip attribute,\n// i.e. a `string`, and intersecting that with `ReactNode` leaves `string` — the\n// header below could never be given an element.\nexport type LiquidAccordionItemProps = Omit<HTMLAttributes<HTMLDivElement>, 'title'> & LiquidStyleProps & {\n  children: ReactNode\n  subtitle?: ReactNode\n  title: ReactNode\n  value: string\n}\n\nexport const LiquidAccordionItem = forwardRef<HTMLDivElement, LiquidAccordionItemProps>(({\n  children,\n  className,\n  style,\n  styles,\n  subtitle,\n  title,\n  value,\n  ...props\n}, ref) => {\n  const root = useLiquidStyles('lq-accordion__item', { className, style, styles })\n\n  return (\n    <Accordion.Item className={root.className} ref={ref} style={root.style} value={value} {...props}>\n      {/* A real heading, so screen-reader users can jump between sections. */}\n      <Accordion.Header className=\"lq-accordion__header\">\n        <Accordion.Trigger className=\"lq-accordion__trigger\">\n          <span className=\"lq-accordion__heading\">\n            <span className=\"lq-accordion__title\">{title}</span>\n            {subtitle && <span className=\"lq-accordion__subtitle\">{subtitle}</span>}\n          </span>\n          <span className=\"lq-accordion__chevron\"><ChevronDownGlyph size={15} /></span>\n        </Accordion.Trigger>\n      </Accordion.Header>\n      <Accordion.Panel className=\"lq-accordion__content\">\n        <div className=\"lq-accordion__content-inner\">{children}</div>\n      </Accordion.Panel>\n    </Accordion.Item>\n  )\n})\n\nLiquidAccordionItem.displayName = 'LiquidAccordionItem'\n",
      "path": "registry/liquid-accordion.tsx",
      "type": "registry:ui"
    }
  ],
  "name": "liquid-accordion",
  "registryDependencies": [
    "https://liquefy-ui.com/r/liquefy-ui.json",
    "https://liquefy-ui.com/r/internal-glyphs.json",
    "https://liquefy-ui.com/r/liquid-surface.json",
    "https://liquefy-ui.com/r/styles-prop.json"
  ],
  "title": "LiquidAccordion",
  "type": "registry:ui"
}
