Components
Editing Locale Switcher
A compact localized select for choosing which locale is being edited in multilingual forms.
Install
Add this registry item to your app with shadcn.
bash
bunx --bun shadcn@latest add https://krakstack.net/r/editing-locale-switcher.jsonOverview
editing-locale-switcher provides a small form control for switching the active editing locale in multilingual forms. It is useful for forms that store localized fields in metadata or translation maps.
Features
- Typed
EditingLocaleunion for English and French - Controlled
valueandonValueChangeprops - Mobile-friendly icon label with desktop text
- In-file English and French labels with optional message overrides
Usage
tsx
import { EditingLocaleSwitcher, type EditingLocale } from "@/components/ui/editing-locale-switcher";
import { useState } from "react";
const [locale, setLocale] = useState<EditingLocale>("en");
<EditingLocaleSwitcher value={locale} onValueChange={setLocale} />
<EditingLocaleSwitcher value={locale} onValueChange={setLocale} messages={{ label: "Language" }} />Dependencies
Packages and shadcn components required by this registry item.