{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "description": "A small count or status pill for hanging off icons and labels.",
  "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 { forwardRef, type HTMLAttributes, type ReactNode } from 'react'\nimport { useLiquidStyles, type LiquidStyleProps } from '@/lib/styles-prop'\n\nexport type LiquidBadgeProps = HTMLAttributes<HTMLSpanElement> & LiquidStyleProps & {\n  children?: ReactNode\n  count?: number\n  dot?: boolean\n  max?: number\n  showZero?: boolean\n  tint?: string\n}\n\nexport const LiquidBadge = forwardRef<HTMLSpanElement, LiquidBadgeProps>(({\n  children,\n  className,\n  count,\n  dot = false,\n  max = 99,\n  showZero = false,\n  style,\n  styles,\n  tint,\n  ...props\n}, ref) => {\n  const showCount = count !== undefined && (count > 0 || showZero)\n  const visible = dot || showCount\n  const display = count !== undefined && count > max ? `${max}+` : count\n  const root = useLiquidStyles('lq-badge', {\n    className,\n    style,\n    styles,\n    vars: tint ? { '--lq-badge-tint': tint } : undefined,\n  })\n\n  return (\n    <span className={root.className} ref={ref} style={root.style} {...props}>\n      {children}\n      {visible && (\n        <span className=\"lq-badge__indicator\" data-dot={dot}>\n          {!dot && display}\n        </span>\n      )}\n    </span>\n  )\n})\n\nLiquidBadge.displayName = 'LiquidBadge'\n",
      "path": "registry/liquid-badge.tsx",
      "type": "registry:ui"
    }
  ],
  "name": "liquid-badge",
  "registryDependencies": [
    "https://liquefy-ui.com/r/liquefy-ui.json",
    "https://liquefy-ui.com/r/styles-prop.json"
  ],
  "title": "LiquidBadge",
  "type": "registry:ui"
}
