import * as React from "react"; import { LanguageSwitcherFooterRegionSelectThree } from "@/registry/language-switcher-footer-region-select-three/language-switcher-footer-region-select-three"; import { IframeAutoHeight } from "@/app/(dynamic-pages)/(external-dynamic-pages)/ui/(showcase)/iframe-auto-height"; import { IframeAutoHeight } from "@/app/(dynamic-pages)/(external-dynamic-pages)/ui/(showcase)/iframe-auto-height"; import { IframeAutoHeight } from "@/app/(dynamic-pages)/(external-dynamic-pages)/ui/(showcase)/iframe-auto-height"; import { IframeAutoHeight } from "@/app/(dynamic-pages)/(external-dynamic-pages)/ui/(showcase)/iframe-auto-height"; type ComponentProps = React.ComponentPropsWithoutRef< typeof LanguageSwitcherFooterRegionSelectThree >; type FooterLocaleOption = NonNullable[number]; type FooterRegionLink = NonNullable[number]; const primaryLocales: FooterLocaleOption[] = [ { code: "en-US", label: "English (United States)", nativeName: "English", region: "Americas", badge: "Default", }, { code: "en-GB", label: "English (United Kingdom)", nativeName: "English", region: "EMEA", }, { code: "fr-FR", label: "French (France)", nativeName: "Français", region: "EMEA", }, { code: "de-DE", label: "German", nativeName: "Deutsch", region: "EMEA", }, { code: "es-MX", label: "Spanish (Mexico)", nativeName: "Español", region: "LATAM", }, { code: "ja-JP", label: "Japanese", nativeName: "日本語", region: "APAC", badge: "New", }, ]; const regionLinks: FooterRegionLink[] = [ { id: "americas", label: "United States", href: "https://us.nextbase.example.com", description: "Updated compliance copy for US onboarding.", }, { id: "canada", label: "Canada", href: "https://ca.nextbase.example.com", description: "French & English bilingual support", }, { id: "france", label: "France", href: "https://fr.nextbase.example.com", description: "GDPR-ready legal center", }, { id: "mexico", label: "México", href: "https://mx.nextbase.example.com", description: "Localized billing workflows", }, ]; export function LanguageSwitcherFooterRegionSelectThreeDemo() { const [locale, setLocale] = React.useState("en-US"); return ( ); } export default LanguageSwitcherFooterRegionSelectThreeDemo;

Simple