{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "ds-sidebar-search",
  "title": "Sidebar Search",
  "description": "Campo de busca para sidebar com label sr-only e ícone — inspirado em shadcn sidebar SearchForm.",
  "dependencies": [
    "class-variance-authority",
    "lucide-react"
  ],
  "registryDependencies": [
    "@lema-ds/sidebar",
    "@lema-ds/skeleton",
    "@lema-ds/ui-i18n",
    "@lema-ds/label",
    "@lema-ds/ds-locale-provider"
  ],
  "files": [
    {
      "path": "components/ds/ds-sidebar-search.tsx",
      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { SearchIcon } from \"lucide-react\"\n\nimport { cn } from \"@/lib/utils\"\nimport { UI_I18N, type UILocale } from \"@/lib/ui-i18n\"\nimport { useUILocale } from \"@/components/ui/ds-locale-provider\"\nimport { Label } from \"@/components/ui/label\"\nimport { Skeleton } from \"@/components/ui/skeleton\"\nimport {\n  SidebarGroup,\n  SidebarGroupContent,\n  SidebarInput,\n} from \"@/components/ui/sidebar\"\n\n// ── Types ──\n\nexport interface SidebarSearchProps\n  extends\n    Omit<React.ComponentProps<\"form\">, \"onSubmit\">,\n    VariantProps<typeof sidebarSearchVariants> {\n  placeholder?: string\n  defaultValue?: string\n  onSearch?: (value: string) => void\n  onSubmit?: (e: React.FormEvent<HTMLFormElement>) => void\n  locale?: UILocale\n  loading?: boolean\n}\n\n// ── Variants ──\n\nexport const sidebarSearchVariants = cva(\"\", {\n  variants: {\n    size: {\n      sm: \"\",\n      md: \"\",\n      lg: \"\",\n    },\n  },\n  defaultVariants: {\n    size: \"md\",\n  },\n})\n\n// ── Component ──\n\nexport function SidebarSearch({\n  placeholder,\n  defaultValue = \"\",\n  onSearch,\n  locale: localeProp,\n  loading = false,\n  className,\n  size = \"md\",\n  onSubmit,\n  ...props\n}: SidebarSearchProps) {\n  const locale = useUILocale(localeProp)\n  const t = UI_I18N[locale]?.sidebarSearch ?? UI_I18N[\"en-US\"].sidebarSearch\n  const id = React.useId()\n  const inputId = `sidebar-search-input-${id}`\n  const [value, setValue] = React.useState(defaultValue)\n\n  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault()\n    onSubmit?.(e)\n    if (value.trim()) onSearch?.(value.trim())\n  }\n\n  if (loading) {\n    return (\n      <div data-slot=\"sidebar-search-skeleton\" className={cn(\"p-2\", className)}>\n        <Skeleton className=\"h-8 w-full rounded-lg\" />\n      </div>\n    )\n  }\n\n  return (\n    <form\n      data-slot=\"sidebar-search\"\n      role=\"search\"\n      aria-label={t.label}\n      onSubmit={handleSubmit}\n      className={cn(sidebarSearchVariants({ size }), className)}\n      {...props}\n    >\n      <SidebarGroup className=\"py-0\">\n        <SidebarGroupContent className=\"relative\">\n          <Label htmlFor={inputId} className=\"sr-only\">\n            {t.label}\n          </Label>\n          <SidebarInput\n            id={inputId}\n            placeholder={placeholder ?? t.placeholder}\n            value={value}\n            onChange={(e) => setValue(e.target.value)}\n            className=\"h-8 pl-8\"\n            aria-label={t.label}\n          />\n          <SearchIcon\n            className=\"pointer-events-none absolute top-1/2 left-2 size-4 -translate-y-1/2 text-muted-foreground opacity-50 select-none\"\n            aria-hidden=\"true\"\n          />\n        </SidebarGroupContent>\n      </SidebarGroup>\n    </form>\n  )\n}\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}
