useTranslations() returns the Translations object for the currently active language. Use it when building custom consent UI that needs translated text.
import { useTranslations } from '@c15t/react';
function CustomBanner() {
const translations = useTranslations();
return (
<div>
<h2>{translations.cookieBanner.title}</h2>
<p>{translations.cookieBanner.description}</p>
<button>{translations.common.acceptAll}</button>
<button>{translations.common.rejectAll}</button>
</div>
);
}The returned Translations object has these sections:
Translations update automatically when the language changes:
import { useConsentManager, useTranslations } from '@c15t/react';
function LocalizedConsent() {
const { setLanguage } = useConsentManager();
const translations = useTranslations();
return (
<div>
<p>{translations.cookieBanner.description}</p>
<button onClick={() => setLanguage('de')}>Deutsch</button>
<button onClick={() => setLanguage('fr')}>Français</button>
</div>
);
}Partial<CommonTranslations>Partial<ConsentManagerDialogTranslations>{
experience?: Partial<ConsentTypeTranslations> | undefined;
functionality?: Partial<ConsentTypeTranslations> | undefined;
marketing?: Partial<ConsentTypeTranslations> | undefined;
measurement?: Partial<ConsentTypeTranslations> | undefined;
necessary?: Partial<ConsentTypeTranslations> | undefined;
}Partial<CookieBannerTranslations>Partial<FrameTranslations> | undefinedDeepPartial<IABTranslations> | undefinedPartial<LegalLinksTranslations> | undefined