{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "language-select",
  "title": "Language select",
  "description": "LanguageSelect and LanguageSelectText: a popover listing the locales from RootProvider's i18n prop, shown by the layouts when there is more than one.",
  "dependencies": [
    "class-variance-authority",
    "cn",
    "@fuma-translate/react@^1.0.2"
  ],
  "registryDependencies": [
    "button",
    "popover",
    "@docscn/i18n-context"
  ],
  "files": [
    {
      "path": "registry/base/docs/layouts/shared/slots/language-select.tsx",
      "content": "// Adapted from Fumadocs UI (https://github.com/fuma-nama/fumadocs)\n// Copyright (c) 2023 Fuma, MIT License\n\"use client\";\n\nimport { useTranslations } from \"@fuma-translate/react\";\nimport type { VariantProps } from \"class-variance-authority\";\nimport { cn } from \"cn\";\nimport type { ComponentProps } from \"react\";\nimport { buttonVariants } from \"@/components/ui/button\";\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from \"@/components/ui/popover\";\nimport { useI18n } from \"../../../contexts/i18n\";\n\nexport interface LanguageSelectProps extends ComponentProps<\"button\"> {\n  variant?: VariantProps<typeof buttonVariants>[\"variant\"];\n}\n\nexport function LanguageSelect({\n  className,\n  variant = \"ghost\",\n  children,\n  ...rest\n}: LanguageSelectProps): React.ReactElement {\n  const context = useI18n();\n  const t = useTranslations({ note: \"language switcher\" });\n  if (!context.locales) throw new Error(\"Missing `<I18nProvider />`\");\n\n  const chooseLanguage = t(\"Choose a language\");\n\n  return (\n    <Popover>\n      <PopoverTrigger\n        aria-label={t(\"Choose a language\", { note: \"aria-label\" })}\n        className={cn(\n          buttonVariants({ variant }),\n          \"gap-1.5 px-2 data-popup-open:bg-accent data-popup-open:text-accent-foreground\",\n          className,\n        )}\n        {...rest}\n      >\n        {children}\n      </PopoverTrigger>\n      <PopoverContent className=\"w-auto min-w-40 gap-0.5 p-1\">\n        <p className=\"p-2 text-xs font-medium text-muted-foreground\">\n          {chooseLanguage}\n        </p>\n        {context.locales.map((item) => (\n          <button\n            key={item.locale}\n            type=\"button\"\n            className={cn(\n              \"rounded-md px-2 py-1.5 text-start text-sm transition-colors\",\n              item.locale === context.locale\n                ? \"bg-primary/10 text-primary\"\n                : \"text-muted-foreground hover:bg-accent hover:text-accent-foreground\",\n            )}\n            onClick={() => {\n              context.onChange?.(item.locale);\n            }}\n          >\n            {item.name}\n          </button>\n        ))}\n      </PopoverContent>\n    </Popover>\n  );\n}\n\nexport type LanguageSelectTextProps = ComponentProps<\"span\">;\n\nexport function LanguageSelectText(props: LanguageSelectTextProps) {\n  const { locales, locale } = useI18n();\n  const text = locales?.find((item) => item.locale === locale)?.name;\n\n  return <span {...props}>{text}</span>;\n}\n",
      "type": "registry:component",
      "target": "@components/docs/layouts/shared/slots/language-select.tsx"
    }
  ],
  "type": "registry:component"
}